#signin_page { position: relative; width: 100%; overflow: hidden }
#signin_page .signin_hero { position: relative; display: flex; align-items: center; padding: 80px 0 40px; background: linear-gradient(110deg,rgb(248 251 255/60%) 0%,rgb(238 247 255/80%) 48%,rgb(228 243 255/50%) 100%); overflow: hidden }
#signin_page .signin_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; overflow: hidden }
#signin_page .videobox { position: absolute; width: 100%; height: 100%; top: 0 }
#signin_page .videobox video { width: 100% }
#signin_page .signin_bg:before { content: ""; position: absolute; width: 800px; height: 800px; right: -210px; top: -320px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.16) 0%,rgba(20,156,255,.04) 45%,rgba(20,156,255,0) 72%) }
#signin_page .signin_bg:after { content: ""; position: absolute; width: 650px; height: 650px; left: -300px; bottom: -350px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.08) 0%,rgba(20,156,255,0) 70%) }
#signin_page .signin_orbit { position: absolute; border: 1px solid rgba(20,156,255,.18); border-radius: 50%; transform: rotate(-13deg) }
#signin_page .signin_orbit01 { width: 900px; height: 320px; right: -220px; top: 21% }
#signin_page .signin_orbit02 { width: 650px; height: 220px; right: -50px; top: 35%; border-color: rgba(247,37,106,.12); transform: rotate(12deg) }
#signin_page .signin_dot { position: absolute; width: 8px; height: 8px; border-radius: 50% }
#signin_page .signin_dot01 { right: 10%; top: 17%; background: var(--triadic2) }
#signin_page .signin_dot02 { right: 31%; top: 56%; background: var(--triadic1) }
#signin_page .signin_dot03 { left: 7%; bottom: 15%; background: var(--accent) }
#signin_page .signin_container { position: relative; z-index: 3 }
#signin_page .signin_grid { display: grid; align-items: center; justify-content: space-between; grid-template-columns: 45% 50% }
#signin_page .signin_kicker { margin-bottom: 18px; color: var(--secondary); font-family: 'Raleway',sans-serif; font-size: 13px; font-weight: 700; letter-spacing: .35em }
#signin_page .signin_title { max-width: 720px; color: var(--primary); font-size: clamp(30px,3.2vw,45px); font-weight: 800; line-height: 1.28; letter-spacing: -.02em }
#signin_page .signin_title span { display: inline; background: linear-gradient(90deg,var(--accent) 0%,var(--triadic2) 33%,var(--complement) 66%,var(--triadic1) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text }
#signin_page .signin_desc { max-width: 650px; margin-top: 25px; color: #50698f; font-size: 17px; line-height: 2; letter-spacing: .02em }
#signin_page .signin_advantage { display: flex; align-items: center; gap: 0; margin: 25px 0 40px; flex-wrap: wrap }
#signin_page .signin_advantage_item { position: relative; display: flex; align-items: center; padding-right: 28px; margin-right: 28px }
#signin_page .signin_advantage_item:not(:last-child):after { content: ""; position: absolute; right: 0; top: 50%; width: 1px; height: 38px; background: #cfdeef; transform: translateY(-50%) }
#signin_page .signin_advantage_icon { display: flex; align-items: center; justify-content: center; width: 42px; aspect-ratio: 1/1; margin-right: 12px; border: 1px solid #c9dcef; border-radius: 50%; color: var(--accent); font-size: 17px }
#signin_page .signin_advantage_title { color: var(--primary); font-size: 15px; font-weight: 700 }
#signin_page .signin_advantage_desc { color: #8798b2; font-size: 12px; white-space: nowrap }
#signin_page .signin_card { position: relative; z-index: 2; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px) }
#signin_page .signin_form_area { left: 40%; position: absolute; width: 70%; bottom: -40px }
#signin_page .signin_field { position: relative; margin-bottom: 24px }
#signin_page .signin_input { position: relative }
#signin_page .signin_input>.glyphicon { position: absolute; left: 17px; top: 50%; z-index: 4; color: #8fa6c5; font-size: 15px; transform: translateY(-50%) }
#signin_page .signin_input .form-control { height: 54px; padding: 10px 15px 10px 47px; border: 1px solid #dce6f2; border-radius: 10px; background: #f9fbfe; box-shadow: none; color: var(--primary); font-size: 15px; transition: .3s }
#signin_page .signin_input .form-control:focus { border-color: var(--accent); background: #fff; box-shadow: 0 0 0 4px rgba(20,156,255,.08) }
#signin_page .form-group__password .signin_input .form-control { padding-right: 105px }
#signin_page .forgot-password { position: absolute; right: 15px; bottom: 17px; z-index: 6; color: var(--accent); font-size: 12px; font-weight: 500 }
#signin_page .forgot-password:hover { color: var(--primary) }
#signin_page .signin_option { display: flex; align-items: center; justify-content: space-between; margin-top: -5px; margin-bottom: 20px }
#signin_page .signin_option .checkbox { margin: 0 }
#signin_page .signin_option .checkbox label { padding-left: 23px; color: #7487a5; font-size: 13px; font-weight: 400 }
#signin_page .signin_option .checkbox input { margin-top: 4px }
#signin_page .signin_captcha { margin-bottom: 20px }
#signin_page .signin_submit { display: grid; grid-template-columns: 1fr 1fr; gap: 10px }
#signin_page .signin_submit a { width: 100%; height: 45px; padding: 0 24px; border: 0; border-radius: 60px; background: var(--secondary); color: #fff; font-size: 15px; font-weight: 400; letter-spacing: .04em; transition: .35s; display: flex; align-items: center; justify-content: center }
#signin_page .signin_submit .btn { display: flex; align-items: center; justify-content: center; width: 100%; height: 45px; padding: 0 24px; border: 0; border-radius: 60px; background: var(--triadic1); color: #fff; font-size: 15px; font-weight: 400; letter-spacing: .04em; transition: .35s }
#signin_page .signin_google { margin-top: 24px }
#signin_page .signin_or_text { position: relative; margin-bottom: 18px; text-align: center }
#signin_page .signin_or_text:before { content: ""; position: absolute; left: 0; top: 50%; width: 100%; height: 1px; background: #e3eaf3 }
#signin_page .signin_or_text span { position: relative; z-index: 2; padding: 0 12px; background: #fff; color: #a1afc2; font-size: 10px; letter-spacing: .2em }
#signin_page .g_id_signin { display: flex; justify-content: center }
#signin_page .signin_signup { margin-top: 26px; text-align: center; color: #7f90aa; font-size: 13px }
#signin_page .signin_signup a { margin-left: 6px; color: var(--accent); font-weight: 700 }
#signin_page .signin_signup a:hover { color: var(--primary) }
#signin_page .signin_auth { padding: 70px 0; background: #fff }
#signin_page .signin_auth_inner { padding: 35px 40px; border: 1px solid #e4ebf4; border-radius: 16px; background: #f8fbff; color: #526987; font-size: 16px; line-height: 2 }
#num_area { position: relative; width: 100%; padding: 70px 0; overflow: hidden; background: linear-gradient(115deg,#03183d 0%,#022764 52%,#031a42 100%); color: #fff }
#num_area .num_wrap { position: relative; z-index: 2; display: flex; align-items: flex-end; justify-content: space-between }
#num_area .num_head { width: 34%; padding-right: 45px }
#num_area .num_entitle { margin-bottom: 10px; color: #b5caff; font-family: 'Raleway',sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .35em }
#num_area .num_title { margin-bottom: 14px; color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em }
#num_area .num_desc { color: #9fb3d1; font-size: 15px; line-height: 1.9 }
#num_area .num_list { display: flex; align-items: center; justify-content: flex-end; width: 66% }
#num_area .num_item { position: relative; width: 25%; padding: 5px 28px; text-align: center }
#num_area .num_item:not(:first-child):before { content: ""; position: absolute; left: 0; top: 50%; width: 1px; height: 64px; background: rgba(255,255,255,.28); transform: translateY(-50%) }
#num_area .num_value { display: flex; align-items: flex-end; justify-content: center; color: #fff; font-size: clamp(34px,3vw,50px); font-weight: 700; line-height: 1; white-space: nowrap; text-shadow: 0 5px 25px rgba(20,156,255,.15); font-family: "Arimo",sans-serif }
#num_area .num_value b { margin-left: 2px; font-size: .58em; font-weight: 700; line-height: 1.2 }
#num_area .num_name { margin-top: 12px; color: #fff; font-size: 15px; font-weight: 500; letter-spacing: .02em }
#service_area { position: relative; width: 100%; padding: 100px 0 110px; overflow: hidden; background: var(--primary); color: #fff }
#service_area .container { position: relative; z-index: 2 }
#service_area .service_head { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 48px }
#service_area .service_head_left { width: 50% }
#service_area .service_head_right { width: 42%; padding-bottom: 3px; color: #9fb3d1; font-size: 15px; line-height: 1.9 }
#service_area .service_entitle { margin-bottom: 10px; color: #b5caff; font-family: 'Raleway',sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .35em }
#service_area .service_title { color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em }
#service_area .service_list { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px }
#service_area .service_item { position: relative; display: flex; flex-direction: column; min-height: 365px; padding: 24px 20px 20px; border: 1px solid rgba(115,164,231,.28); border-radius: 10px; background: linear-gradient(180deg,rgba(9,42,88,.86) 0%,rgba(4,29,67,.9) 100%); color: #fff; overflow: hidden; transition: .45s cubic-bezier(.22,.61,.36,1) }
#service_area .service_item:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: var(--service-color); transform: scaleX(0); transform-origin: left center; transition: .4s }
#service_area .service_item:hover { color: #fff; border-color: var(--service-color); box-shadow: 0 24px 50px rgba(0,0,0,.24) }
#service_area .service_item:hover:before { transform: scaleX(1) }
#service_area .service_top { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px }
#service_area .service_icon { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 14px; background: var(--service-color); color: #fff; font-size: 25px; font-weight: 800 }
#service_area .service_icon svg { fill: white; width: 26px; height: 26px }
#service_area .service_line .service_icon { font-size: 10px; letter-spacing: -.03em }
#service_area .service_no { color: rgba(255,255,255,.28); font-family: 'Raleway',sans-serif; font-size: 10px; font-weight: 700; letter-spacing: .12em }
#service_area .service_name { position: relative; z-index: 2; margin-bottom: 2px; color: #fff; font-size: 20px; font-weight: 800; line-height: 1.35 }
#service_area .service_item ul { position: relative; z-index: 2; margin: 0; padding: 0; list-style: none }
#service_area .service_item li { position: relative; margin-bottom: 8px; padding-left: 17px; color: #c3d2e8; font-size: 13px; line-height: 1.55 }
#service_area .service_item li:before { content: ""; position: absolute; left: 1px; top: 8px; width: 6px; height: 3px; border-left: 2px solid var(--service-color); border-bottom: 2px solid var(--service-color); transform: rotate(-45deg) }
#service_area .service_btn { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; height: 42px; margin-top: auto; padding: 0 16px; border: 1px solid rgba(255,255,255,.28); border-radius: 30px; color: #fff; font-size: 13px; font-weight: 600; transition: .35s }
#service_area .service_btn i { font-style: normal; font-size: 17px; transition: .35s }
#service_area .service_item .service_btn { border-color: var(--service-color); background: var(--service-color) }
#service_area .service_item:hover .service_btn i { transform: translateX(4px) }
#service_area .service_fb { --service-color: #2f80ff; --service-glow: rgba(47,128,255,.24); --service-shadow: rgba(47,128,255,.28); grid-column: span 2 }
#service_area .service_ig { --service-color: #e83cff; --service-glow: rgba(232,60,255,.22); --service-shadow: rgba(232,60,255,.25) }
#service_area .service_ig .service_icon { background: linear-gradient(135deg,#8b2cf5 0%,#f7256a 52%,#ff9f1c 100%) }
#service_area .service_yt { --service-color: #ff304c; --service-glow: rgba(255,48,76,.22); --service-shadow: rgba(255,48,76,.22) }
#service_area .service_tt { --service-color: #64d6ff; --service-glow: rgba(100,214,255,.18); --service-shadow: rgba(100,214,255,.2) }
#service_area .service_tt .service_icon { background: #0c172b; color: #fff }
#service_area .service_th { --service-color: #a891ff; --service-glow: rgba(168,145,255,.18); --service-shadow: rgba(168,145,255,.2) }
#service_area .service_th .service_icon { background: #11151d }
#service_area .service_line { --service-color: #20d78d; --service-glow: rgba(32,215,141,.18); --service-shadow: rgba(32,215,141,.2) }
#service_area .service_shopee { --service-color: #ff774d; --service-glow: rgba(255,119,77,.2); --service-shadow: rgba(255,119,77,.22) }
#service_area .service_shopee .service_icon { background: linear-gradient(135deg,#ff964d,#ff5b47) }
#contact_area { position: relative; width: 100%; padding: 85px 0 90px; overflow: hidden; background: linear-gradient(115deg,#031735 0%,#022764 48%,#041a3a 100%); color: #fff }
#contact_area .contact_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; overflow: hidden; display: flex; align-items: center }
#contact_area .contact_bg img { height: 100%; width: 100%; object-fit: cover; object-position: 80% 50% }
#contact_area .contact_orbit { position: absolute; border: 1px solid rgba(89,167,255,.16); border-radius: 50% }
#contact_area .contact_orbit01 { width: 650px; height: 210px; right: -40px; top: 50%; transform: translateY(-50%) rotate(-9deg) }
#contact_area .contact_orbit02 { width: 520px; height: 160px; right: 20px; top: 49%; border-color: rgba(247,37,106,.13); transform: translateY(-50%) rotate(10deg) }
#contact_area .contact_dot { position: absolute; width: 7px; height: 7px; border-radius: 50% }
#contact_area .contact_dot01 { right: 9%; top: 20%; background: #ff9f1c; box-shadow: 0 0 14px rgba(255,159,28,.7) }
#contact_area .contact_dot02 { right: 26%; bottom: 17%; background: #f7256a; box-shadow: 0 0 14px rgba(247,37,106,.7) }
#contact_area .contact_dot03 { left: 48%; top: 22%; background: #22c7f2; box-shadow: 0 0 14px rgba(34,199,242,.7) }
#contact_area .container { position: relative; z-index: 2 }
#contact_area .contact_wrap { display: flex; align-items: center; justify-content: space-between; gap: 7% }
#contact_area .contact_content { width: 58% }
#contact_area .contact_entitle { margin-bottom: 10px; color: #9dbdf1; font-family: 'Raleway',sans-serif; font-size: 11px; font-weight: 700; letter-spacing: .3em }
#contact_area .contact_title { max-width: 720px; color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em }
#contact_area .contact_desc { margin-top: 14px; color: #adc0dc; font-size: 16px; line-height: 1.9 }
#contact_area .contact_action { display: flex; align-items: center; gap: 22px; margin-top: 30px }
#contact_area .contact_btn { display: inline-flex; align-items: center; justify-content: center; min-width: 170px; height: 52px; padding: 0 25px; border-radius: 50px; background: var(--triadic1); color: #fff; font-size: 15px; font-weight: 500; box-shadow: 0 10px 28px rgba(76,64,230,.3); transition: .35s }
#contact_area .contact_btn i { margin-left: 12px; font-style: normal; font-size: 19px; transition: .35s }
#contact_area .contact_btn:hover { color: #fff; background: var(--accent) }
#contact_area .contact_btn:hover i { transform: translateX(5px) }
#contact_area .contact_more { position: relative; color: #c9d8ed; font-size: 14px; font-weight: 600 }
#contact_area .contact_more:after { content: ""; position: absolute; left: 0; bottom: -5px; width: 100%; height: 1px; background: #4f8fe8; transform: scaleX(.35); transform-origin: left center; transition: .35s }
#contact_area .contact_more:hover { color: #fff }
#contact_area .contact_more:hover:after { transform: scaleX(1) }
@media(max-width:1680px) {
  #signin_page .videobox video { width: 110% }
}
@media(max-width:1440px) {
  #signin_page .signin_desc { margin-bottom: 20px }
  #signin_page .signin_advantage { display: none }
  #signin_page .signin_form_area { left: 43%; width: 60% }
}
@media(max-width:1280px) {
  #signin_page .videobox .video-bg { height: 100% }
  #signin_page .videobox video { width: auto; height: 100%; right: 0; position: absolute }
}
@media(max-width:1199px) {
  #num_area .num_head,#num_area .num_list { width: 100%; padding: 0 }
  #num_area .num_head { display: flex; flex-direction: column; align-items: center }
  #num_area .num_wrap { gap: 30px; flex-wrap: wrap }
  #signin_page .signin_form_area { bottom: 80px }
  #service_area { padding: 90px 0 100px }
  #service_area .service_head_left { width: 55% }
  #service_area .service_head_right { width: 40% }
  #contact_area .contact_content { width: 60% }
  #contact_area .contact_visual { width: 33% }
  #contact_area .contact_advantage_item { padding-right: 16px; margin-right: 16px }
}
@media(max-width:991px) {
  #signin_page .signin_hero { padding: 65px 0 0 }
  #signin_page .signin_grid { display: block }
  #signin_page .signin_content { width: 100%; max-width: 720px; margin: 0 auto 50px; text-align: center }
  #signin_page .signin_desc { margin-left: auto; margin-right: auto }
  #signin_page .signin_advantage { justify-content: center }
  #signin_page .signin_platform_list { justify-content: center }
  #signin_page .signin_form_area { width: 100%; max-width: 520px; margin: 0 auto; display: none }
  #num_area { padding: 60px 0 }
  #num_area .num_desc br { display: none }
  #num_area .num_list { width: 100% }
  #service_area .service_head { display: block }
  #service_area .service_head_left,#service_area .service_head_right { width: 100% }
  #service_area .service_head_right { margin-top: 15px }
  #service_area .service_head_right br { display: none }
  #service_area .service_list { grid-template-columns: repeat(2,1fr) }
  #contact_area { padding: 75px 0 }
  #contact_area .contact_wrap { display: block }
  #contact_area .contact_desc { max-width: 680px; margin-left: auto; margin-right: auto }
  #contact_area .contact_visual { width: 100%; max-width: 430px; height: 280px; margin: 50px auto 0 }
}
@media(max-width:767px) {
  #signin_page .signin_hero { min-height: auto; padding: 55px 0 0 }
  #signin_page .signin_content { margin-bottom: 38px; padding: 0 5px }
  #signin_page .signin_kicker { margin-bottom: 14px; font-size: 11px; letter-spacing: .25em }
  #signin_page .signin_title { font-size: clamp(34px,9vw,48px); line-height: 1.35 }
  #signin_page .signin_desc { margin-top: 20px; font-size: 15px; line-height: 1.9 }
  #signin_page .signin_advantage { flex-wrap: wrap; justify-content: center; gap: 20px; margin-top: 35px }
  #signin_page .signin_advantage_item { width: calc(50% - 10px); margin: 0; padding: 0; justify-content: center }
  #signin_page .signin_advantage_item:not(:last-child):after { display: none }
  #signin_page .signin_advantage_item:last-child { width: 100% }
  #signin_page .signin_platform { margin-top: 35px }
  #signin_page .signin_card { padding: 36px 25px 30px; border-radius: 18px }
  #signin_page .signin_card:before { left: 25px }
  #signin_page .signin_card_title { font-size: 26px }
  #signin_page .signin_card_desc { margin-bottom: 26px; font-size: 13px }
  #signin_page .signin_auth { padding: 45px 0 }
  #signin_page .signin_auth_inner { padding: 25px 20px; font-size: 15px }
  #num_area { padding: 50px 0 }
  #num_area .num_list { flex-wrap: wrap }
  #num_area .num_item { width: 50%; padding: 22px 10px }
  #num_area .num_item:first-child:before { content: ""; position: absolute; right: 0; top: 50%; width: 1px; height: 64px; background: rgba(255,255,255,.28); transform: translateY(-50%) }
  #num_area .num_item:nth-child(2):before,#num_area .num_item:nth-child(3):before { content: ""; position: absolute; left: 10%; top: 0; width: 80%; height: 1px; background: rgba(255,255,255,.28); transform: none }
  #num_area .num_item:nth-child(2):before { top: unset; bottom: 0 }
  #num_area .num_item:after { display: none!important }
  #num_area .num_value { font-size: 38px }
  #num_area .num_desc { font-size: 15px }
  #service_area { padding: 65px 0 75px }
  #service_area .service_head { margin-bottom: 34px }
  #service_area .service_item { flex: 0 0 78%; min-height: 345px; scroll-snap-align: start }
  #service_area .service_head_right { font-size: 15px }
  #contact_area { padding: 60px 0 65px }
  #contact_area .contact_title { font-size: 34px }
  #contact_area .contact_desc { font-size: 15px }
  #contact_area .contact_desc br { display: none }
  #contact_area .contact_advantage { flex-wrap: wrap; gap: 20px }
  #contact_area .contact_advantage_item { margin: 0; padding: 0 }
  #contact_area .contact_advantage_item:not(:last-child):after { display: none }
  #contact_area .contact_visual { height: 250px }
  #contact_area .contact_globe { right: 50%; width: 220px; height: 220px; transform: translate(50%,-50%) }
}
@media(max-width:500px) {
  #contact_area .contact_content { width: 100% }
  #contact_area .contact_content * { text-align: center }
  #contact_area .contact_bg { background: #050f4b }
  #contact_area .contact_bg img { opacity: .5; object-position: 50% 50% }
  #service_area .service_list { grid-template-columns: 1fr }
  #signin_page .videobox video { right: -30% }
  #signin_page .signin_title br { display: none }
  #signin_page .signin_advantage_item,#signin_page .signin_advantage_item:last-child { width: 100%; justify-content: flex-start; margin-bottom: 16px; padding: 0 20px }
  #signin_page .signin_platform_list { gap: 7px; font-size: 11px }
  #signin_page .signin_card { padding: 0 15px; backdrop-filter: unset }
  #signin_page .signin_card:before { left: 20px }
  #signin_page .signin_input .form-control { height: 52px }
  #signin_page .form-group__password .signin_input .form-control { padding-right: 95px }
  #num_area .num_entitle { font-size: 10px; letter-spacing: .25em }
  #num_area .num_title { font-size: 28px }
  #num_area .num_value { font-size: 34px }
  #num_area .num_name { font-size: 14px }
  #service_area .service_title { font-size: 30px }
  #service_area .service_entitle { font-size: 10px }
  #service_area .service_item { flex-basis: 86%; padding: 25px }
  #service_area .service_fb { grid-column: unset }
  #service_area .service_name { font-size: 19px; margin-bottom: 13px }
  #contact_area .contact_entitle { font-size: 10px; letter-spacing: .22em }
  #contact_area .contact_title { font-size: 29px }
  #contact_area .contact_action { display: block }
  #contact_area .contact_btn { width: 100% }
  #contact_area .contact_more { display: inline-block; margin-top: 20px }
  #contact_area .contact_advantage { display: block; margin-top: 32px }
  #contact_area .contact_advantage_item { justify-content: flex-start; margin-bottom: 15px; text-align: left }
  #contact_area .contact_visual { height: 220px; margin-top: 35px }
  #contact_area .contact_globe { width: 190px; height: 190px }
  #contact_area .contact_social { width: 42px; height: 42px }
}
@font-face { font-family: 'Glyphicons Halflings'; src: url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/fonts/glyphicons-halflings-regular.woff2') format('woff2'),url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/fonts/glyphicons-halflings-regular.woff') format('woff'),url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/fonts/glyphicons-halflings-regular.ttf') format('truetype') }
.glyphicon { position: relative; top: 1px; display: inline-flex; font-family: 'Glyphicons Halflings'!important; font-style: normal!important; font-weight: 400!important; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; align-items: center; justify-content: center }
#reset_page { position: relative; width: 100%; min-height: calc(100vh - 82px); display: flex; align-items: center; padding: 70px 0; overflow: hidden }
#reset_page .reset_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; overflow: hidden }
#reset_page .reset_bg:before { content: ""; position: absolute; width: 700px; height: 700px; right: -280px; top: -320px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.14) 0%,rgba(20,156,255,0) 70%) }
#reset_page .reset_bg:after { content: ""; position: absolute; width: 520px; height: 520px; left: -220px; bottom: -300px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.07) 0%,rgba(139,44,245,0) 70%) }
#reset_page .container { position: relative; z-index: 2 }
#reset_page .reset_wrap { display: flex; align-items: center; justify-content: center }
#reset_page .reset_card { width: 100%; max-width: 760px; padding: 48px 55px 38px; border-radius: 22px; background: #f8fbfe; box-shadow: 0 25px 70px rgba(2,39,100,.12); text-align: center }
#reset_page .reset_icon { display: flex; align-items: center; justify-content: center; width: 88px; height: 88px; margin: 0 auto 20px; border: 2px solid var(--primary); border-radius: 50% }
#reset_page .reset_icon svg { width: 42px; aspect-ratio: 1; fill: var(--primary) }
#reset_page .reset_lock { position: relative; width: 32px; height: 28px; border: 2px solid var(--primary); border-radius: 5px }
#reset_page .reset_lock:before { content: ""; position: absolute; left: 50%; top: -21px; width: 20px; height: 22px; border: 2px solid var(--primary); border-bottom: 0; border-radius: 12px 12px 0 0; transform: translateX(-50%) }
#reset_page .reset_lock span { position: absolute; left: 50%; top: 50%; width: 3px; height: 8px; border-radius: 2px; background: var(--primary); transform: translate(-50%,-40%) }
#reset_page .reset_title { margin-bottom: 28px; color: var(--primary); font-size: 28px; font-weight: 800; line-height: 1.4 }
#reset_page .reset_field { text-align: left }
#reset_page .reset_field label { display: block; margin-bottom: 8px; color: #667b99; font-size: 15px; font-weight: 500 }
#reset_page .reset_field .form-control { height: 52px; padding: 10px 15px; border: 1px solid #cbd9e9; border-radius: 8px; background: #fff; box-shadow: none; color: var(--primary); font-size: 16px }
#reset_page .reset_field .form-control:focus { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(20,156,255,.08) }
#reset_page .reset_captcha { margin: 20px 0 }
#reset_page .reset_submit { margin-top: 26px }
#reset_page .reset_submit .btn { width: 100%; max-width: 280px; height: 52px; border: 0; border-radius: 50px; background: linear-gradient(90deg,#8b2cf5 0%,#149cff 100%); color: #fff; font-size: 17px; font-weight: 700; transition: .35s }
#reset_page .reset_submit .btn:hover { background: linear-gradient(90deg,#149cff 0%,#149cff 100%) }
#reset_page .reset_back { margin-top: 18px }
#reset_page .reset_back a { color: var(--secondary); font-size: 14px }
#reset_page .reset_back a:hover { color: var(--accent) }
#reset_page .reset_or { position: relative; margin: 34px 0 16px }
#reset_page .reset_or:before { content: ""; position: absolute; left: 0; top: 50%; width: 100%; height: 1px; background: #d8e2ee }
#reset_page .reset_or span { position: relative; z-index: 2; display: inline-block; padding: 0 15px; background: #f8fbfe; color: #8292aa; font-size: 14px }
#reset_page .reset_signup a { color: var(--primary); font-size: 15px; font-weight: 700 }
#reset_page .reset_signup a:hover { color: var(--accent) }
@media(max-width:767px) {
  #reset_page { min-height: auto; padding: 50px 0 }
  #reset_page .reset_card { padding: 38px 25px 30px; border-radius: 18px }
  #reset_page .reset_icon { width: 76px; height: 76px }
  #reset_page .reset_title { font-size: 25px }
}
@media(max-width:500px) {
  #reset_page .reset_card { padding: 32px 20px 26px }
  #reset_page .reset_submit .btn { max-width: none }
}
#signup_page { position: relative; width: 100%; min-height: calc(100vh - 82px); display: flex; align-items: center; padding: 70px 0; overflow: hidden }
#signup_page .signup_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; overflow: hidden }
#signup_page .signup_bg:before { content: ""; position: absolute; width: 720px; height: 720px; right: -300px; top: -340px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.14) 0%,rgba(20,156,255,0) 70%) }
#signup_page .signup_bg:after { content: ""; position: absolute; width: 520px; height: 520px; left: -220px; bottom: -300px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.07) 0%,rgba(139,44,245,0) 70%) }
#signup_page .container { position: relative; z-index: 2 }
#signup_page .signup_wrap { display: flex; align-items: center; justify-content: center }
#signup_page .signup_card { width: 100%; max-width: 760px; padding: 48px 55px 38px; border-radius: 22px; background: #f8fbfe; box-shadow: 0 25px 70px rgba(2,39,100,.12); text-align: center }
#signup_page .signup_icon { display: flex; align-items: center; justify-content: center; width: 88px; height: 88px; margin: 0 auto 16px; border: 2px solid var(--primary); border-radius: 50% }
#signup_page .signup_user_icon { position: relative; width: 40px; height: 40px }
#signup_page .signup_user_icon:before { content: ""; position: absolute; left: 50%; top: 0; width: 16px; height: 16px; border: 2px solid var(--primary); border-radius: 50%; transform: translateX(-50%) }
#signup_page .signup_user_icon:after { content: ""; position: absolute; left: 50%; bottom: 0; width: 34px; height: 20px; border: 2px solid var(--primary); border-radius: 18px 18px 6px 6px; transform: translateX(-50%) }
#signup_page .signup_title { margin-top: 7px; text-align: center; color: var(--primary); font-size: 28px; font-weight: 800; line-height: 1.4 }
#signup_page .signup_desc { margin: 8px 0 30px; text-align: center; color: #8292ab; font-size: 14px; line-height: 1.8 }
#signup_page .signup_fields { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px }
#signup_page .signup_field { margin: 0 }
#signup_page .signup_field label { display: block; margin-bottom: 8px; color: #667b99; font-size: 14px; font-weight: 600; text-align: left }
#signup_page .signup_field .form-control { height: 52px; padding: 10px 15px; border: 1px solid #cbd9e9; border-radius: 8px; background: #fff; box-shadow: none; color: var(--primary); font-size: 15px; transition: .3s }
#signup_page .signup_field .form-control:focus { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(20,156,255,.08) }
#signup_page .signup_captcha { margin-top: 22px; text-align: center }
#signup_page .signup_terms { margin-top: 22px; padding: 16px 18px; border: 1px solid #e0e8f2; border-radius: 10px; background: #f8fbff }
#signup_page .signup_terms label { display: flex; align-items: flex-start; margin: 0; color: #6e819f; font-size: 14px; font-weight: 400; line-height: 1.7 }
#signup_page .signup_terms input { margin: 5px 9px 0 0; accent-color: var(--accent) }
#signup_page .signup_terms a { color: var(--accent); font-weight: 600 }
#signup_page .signup_terms a:hover { color: var(--primary) }
#signup_page .signup_submit { margin-top: 28px; text-align: center }
#signup_page .signup_submit .btn { width: 100%; max-width: 280px; height: 52px; border: 0; border-radius: 50px; background: linear-gradient(90deg,#8b2cf5 0%,#149cff 100%); color: #fff; font-size: 17px; font-weight: 700; transition: .35s }
#signup_page .signup_submit .btn:hover { background: linear-gradient(90deg,#149cff 0%,#149cff 100%) }
#signup_page .signup_google { margin-top: 26px; text-align: center }
#signup_page .signup_or { position: relative; margin-bottom: 20px; text-align: center }
#signup_page .signup_or:before { content: ""; position: absolute; left: 0; top: 50%; width: 100%; height: 1px; background: #d8e2ee }
#signup_page .signup_or span { position: relative; z-index: 2; display: inline-block; padding: 0 15px; background: #fff; color: #8292aa; font-size: 11px; letter-spacing: .16em }
#signup_page .g_id_signin { display: flex; justify-content: center }
#signup_page .signup_login { margin-top: 28px; padding-top: 22px; border-top: 1px solid #e2e9f1; text-align: center; color: #7f90aa; font-size: 15px }
#signup_page .signup_login a { margin-left: 6px; color: var(--accent); font-weight: 700 }
#signup_page .signup_login a:hover { color: var(--primary) }
@media(max-width:767px) {
  #signup_page { min-height: auto; padding: 50px 0 }
  #signup_page .signup_card { padding: 38px 25px 30px; border-radius: 18px }
  #signup_page .signup_icon { width: 76px; height: 76px }
  #signup_page .signup_title { font-size: 25px }
  #signup_page .signup_fields { grid-template-columns: 1fr; gap: 18px }
}
@media(max-width:500px) {
  #signup_page .signup_card { padding: 32px 20px 26px }
  #signup_page .signup_submit .btn { max-width: none }
  #signup_page .signup_terms { padding: 14px }
}
#services_page { position: relative; width: 100%; min-height: 100vh; padding: 70px 0 90px; overflow: hidden; background: linear-gradient(145deg,#010c24 0%,#021a43 48%,#022764 100%); color: #fff }
#services_page .services_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; overflow: hidden }
#services_page .services_bg:before { content: ""; position: absolute; width: 700px; height: 700px; right: -320px; top: -320px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.16) 0%,rgba(20,156,255,0) 70%) }
#services_page .services_bg:after { content: ""; position: absolute; width: 550px; height: 550px; left: -300px; bottom: -300px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.08) 0%,rgba(139,44,245,0) 70%) }
#services_page .container { position: relative; z-index: 2 }
#services_page .services_head { margin-bottom: 38px }
#services_page .services_entitle { margin-bottom: 10px; color: #b5caff; font-family: 'Raleway',sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .35em }
#services_page .services_title { color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em }
#services_page .services_desc { color: #9fb3d1; font-size: 15px; line-height: 1.9 }
#services_page .services_toolbar { position: relative; margin-bottom: 30px; z-index: 3 }
#services_page .services_toolbar .nav { display: flex; align-items: center; margin: 0 }
#services_page .services_toolbar .nav>li { float: none }
#services_page .services_toolbar .btn { height: 48px; border-radius: 10px; font-size: 14px; font-weight: 600 }
#services_page .services_filter .btn,#services_page .services_currency .btn { min-width: 140px; padding: 0 20px; border: 1px solid rgba(71,151,255,.28); background: linear-gradient(135deg,#07377a 0%,#0b4da1 100%); color: #fff; box-shadow: none }
#services_page .services_filter .btn:hover,#services_page .services_currency .btn:hover { border-color: #149cff; background: linear-gradient(135deg,#0a438e 0%,#1265c8 100%) }
#services_page .services_filter { margin-right: 10px }
#services_page .services_search { width: 100%; max-width: 560px; margin-left: auto }
#services_page .services_search .input-group { width: 100% }
#services_page .services_search .form-control { height: 48px; padding: 0 18px; border: 1px solid rgba(93,157,239,.2); border-right: 0; border-radius: 10px 0 0 10px; background: #061a3c; color: #fff; box-shadow: none; font-size: 15px }
#services_page .services_search .form-control::placeholder { color: #6983a8 }
#services_page .services_search .form-control:focus { border-color: #149cff; background: #07214b; box-shadow: 0 0 0 3px rgba(20,156,255,.08) }
#services_page .services_search .btn { width: 58px; border: 1px solid #149cff; border-radius: 0 10px 10px 0; background: linear-gradient(135deg,#149cff,#0866d9); color: #fff }
#services_page .services_search .btn:hover { background: #149cff }
#services_page .dropdown-menu { min-width: 230px; max-height: 380px; margin-top: 8px; padding: 8px; overflow-y: auto; overflow-x: hidden; border: 1px solid rgba(80,154,252,.22); border-radius: 12px; background: #041936; box-shadow: 0 20px 50px rgba(0,0,0,.35) }
#services_page .dropdown-menu::-webkit-scrollbar { width: 6px }
#services_page .dropdown-menu::-webkit-scrollbar-track { background: transparent }
#services_page .dropdown-menu::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(20,156,255,.45) }
#services_page .dropdown-menu::-webkit-scrollbar-thumb:hover { background: #149cff }
#services_page .dropdown-menu>li>a { display: flex; align-items: center; gap: 8px; padding: 10px 13px; border-radius: 7px; color: #b7c9e3; font-size: 14px }
#services_page .dropdown-menu>li>a img { max-width: 18px !important; max-height: 18px !important }
#services_page .dropdown-menu>li>a:hover { color: #fff; background: rgba(20,156,255,.12) }
#services_page .services_table_panel { position: relative; overflow: hidden; border: 1px solid rgba(75,149,246,.18); border-radius: 18px; background: linear-gradient(145deg,rgba(4,29,68,.96),rgba(2,20,49,.98)); box-shadow: 0 30px 70px rgba(0,0,0,.2) }
#services_page .services_table_scroll { width: 100%; overflow-x: auto }
#services_page #service-table { width: 100%; min-width: 1050px; margin: 0; color: #bacbe3; background: transparent }
#services_page #service-table thead { background: linear-gradient(90deg,#092c60 0%,#073777 100%) }
#services_page #service-table thead th { padding: 18px 16px; border: 0; border-bottom: 1px solid rgba(102,170,255,.2); color: #fff; font-size: 14px; font-weight: 700; vertical-align: middle; background: var(--secondary) }
#services_page #service-table thead th.service-description__th { font-size: 0 }
#services_page #service-table tbody td { padding: 17px 16px; border-top: 1px solid rgba(93,151,231,.1); color: #b9c9df; font-family: 'Arimo','Noto Sans TC'; font-size: 14px; line-height: 1.7; vertical-align: middle }
#services_page #service-table .service_data_row { background: rgba(255,255,255,.01); transition: .25s }
#services_page #service-table .service_data_row:hover { background: rgba(20,156,255,.07) }
#services_page #service-table .service_data_row:hover td { color: #e6f0ff }
#services_page #service-table .service_category_row td { padding: 0; border: 0; background: #f8fbfe }
#services_page .service_category_inner { position: relative; display: flex; align-items: center; min-height: 54px; padding: 0 17px; overflow: hidden }
#services_page .service_category_name { display: flex; align-items: center; gap: 9px; color: #fff; font-size: 16px }
#services_page .service_category_name strong { color: #051531; font-weight: 700 }
#services_page .service_category_name img { display: inline-block; max-width: 20px !important; max-height: 20px !important }
#services_page .service_category_line { display: none; flex: 1; height: 1px; margin-left: 18px; background: linear-gradient(90deg,rgba(84,167,255,.25),transparent) }
#services_page .service_id { display: inline-flex; align-items: center; justify-content: center; min-width: 54px; height: 30px; padding: 0 10px; border: 1px solid rgba(92,163,255,.2); border-radius: 20px; background: rgba(20,156,255,.06); color: #77baff; font-family: 'Arimo'; font-size: 12px; font-weight: 700 }
#services_page .service-name { color: #fff!important; font-weight: 600 }
#services_page .service_rate { color: #77d3ff!important; font-weight: 600 }
#services_page .service_quantity { display: inline-block; padding: 4px 9px; border-radius: 5px; background: rgba(255,255,255,.04); color: #c7d5e8 }
#services_page .favorite_td,#services_page .favorite_th { width: 45px; text-align: center }
#services_page [data-favorite-service-id] { color: #6d83a4 }
#services_page .favorite-active,#services_page .favorite-active [data-favorite-icon] { color: #ffbd32 }
#services_page .service-description { text-align: center }
#services_page .service_description_source { display: none }
#services_page .service_detail_btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 112px; height: 38px; padding: 0 15px; border: 1px solid rgba(58,160,255,.38); border-radius: 30px; background: rgba(20,156,255,.07); color: #72c5ff; font-size: 13px; font-weight: 600; white-space: nowrap; transition: .3s }
#services_page .service_detail_btn i { font-style: normal; font-size: 17px; font-weight: 300; line-height: 1; transition: .3s }
#services_page .service_detail_btn:hover { border-color: #149cff; background: #149cff; color: #fff; box-shadow: 0 8px 22px rgba(20,156,255,.2) }
#services_page .service_detail_btn:hover i { transform: rotate(90deg) }
#services_page .services_text { margin-top: 30px; padding: 28px 30px; border: 1px solid rgba(84,151,239,.14); border-radius: 16px; background: rgba(4,29,67,.7); color: #9eb3cf; font-size: 15px; line-height: 2 }
#services_page .services_table_scroll::-webkit-scrollbar { height: 8px }
#services_page .services_table_scroll::-webkit-scrollbar-track { background: #03152f }
#services_page .services_table_scroll::-webkit-scrollbar-thumb { border-radius: 20px; background: #155ab0 }
#serviceDetailModal { z-index: 99999 }
#serviceDetailModal .service_detail_modal_dialog { width: 92%; max-width: 680px }
#serviceDetailModal .service_detail_modal { position: relative; overflow: hidden; border: 1px solid rgba(82,157,255,.28); border-radius: 18px; background: linear-gradient(145deg,#041b40 0%,#02142f 100%); box-shadow: 0 35px 100px rgba(0,0,0,.5); color: #c3d2e8 }
#serviceDetailModal .service_detail_modal:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg,#22c7f2 0%,#149cff 25%,#8b2cf5 58%,#f7256a 80%,#ff9f1c 100%) }
#serviceDetailModal .service_detail_modal_head { display: flex; align-items: flex-start; justify-content: space-between; padding: 28px 30px 23px; border-bottom: 1px solid rgba(94,158,239,.15) }
#serviceDetailModal .service_detail_modal_heading { flex: 1 }
#serviceDetailModal .service_detail_modal_entitle { margin-bottom: 7px; color: #55b9ff; font-family: 'Raleway',sans-serif; font-size: 10px; font-weight: 700; letter-spacing: .25em }
#serviceDetailModal .service_detail_modal_title { padding-right: 30px; color: #fff; font-family: 'Arimo','Noto Sans TC'; font-size: 22px; font-weight: 700; line-height: 1.5 }
#serviceDetailModal .service_detail_close { display: flex; align-items: center; justify-content: center; flex: 0 0 38px; width: 38px; height: 38px; padding: 0; border: 1px solid rgba(116,170,241,.22); border-radius: 50%; background: rgba(255,255,255,.03); color: #a9bedb; font-size: 25px; font-weight: 300; line-height: 1; transition: .3s }
#serviceDetailModal .service_detail_close:hover { padding-bottom: 2.5px; border-color: #149cff; background: rgba(20,156,255,.12); color: #fff; transform: rotate(90deg) }
#serviceDetailModal .service_detail_modal_body { max-height: 55vh; padding: 28px 30px; overflow-y: auto; color: #bdcde3; font-size: 15px; line-height: 1.95; text-align: left }
#serviceDetailModal .service_detail_modal_body strong,#serviceDetailModal .service_detail_modal_body b { color: #fff }
#serviceDetailModal .service_detail_modal_body a { color: #55b9ff }
#serviceDetailModal .service_detail_modal_body::-webkit-scrollbar { width: 6px }
#serviceDetailModal .service_detail_modal_body::-webkit-scrollbar-track { background: #03152f }
#serviceDetailModal .service_detail_modal_body::-webkit-scrollbar-thumb { border-radius: 10px; background: #155ab0 }
#serviceDetailModal .service_detail_modal_bottom { padding: 18px 30px 25px; text-align: center }
#serviceDetailModal .service_detail_ok { min-width: 140px; height: 44px; padding: 0 24px; border: 0; border-radius: 30px; background: linear-gradient(90deg,#8b2cf5 0%,#149cff 100%); color: #fff; font-size: 14px; font-weight: 500; line-height: 44px; transition: .3s }
#serviceDetailModal .service_detail_ok:hover { background: #149cff }
body.service-stiebody>.modal-backdrop { z-index: 9998!important }
body>#serviceDetailModal { z-index: 9999!important }
body>#serviceDetailModal.modal_flex_open { display: flex!important; align-items: center; justify-content: center; padding-right: 0!important }
body>#serviceDetailModal .modal-dialog { position: relative; width: 92%; max-width: 680px; margin: 0; z-index: 1 }
body>#serviceDetailModal .modal-content { position: relative }
#serviceDetailModal.fade .modal-dialog,#serviceDetailModal.fade.in .modal-dialog { -webkit-transform: none!important; -ms-transform: none!important; transform: none!important }
body>.modal-backdrop.in { opacity: .58!important }
@media(max-width:1024px) {
  #services_page { padding: 60px 0 75px }
  #services_page .services_toolbar .nav { display: flex; flex-wrap: wrap; gap: 10px }
  #services_page .services_filter,#services_page .services_currency { margin: 0 }
  #services_page .services_search { width: 100%; max-width: none; margin-left: 0!important }
  #services_page .services_table_panel { overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none }
  #services_page .services_table_scroll { width: 100%; overflow: visible }
  #services_page #service-table { display: block; width: 100%; min-width: 0; border: 0; background: transparent }
  #services_page #service-table thead { display: none }
  #services_page #service-table tbody { display: block; width: 100% }
  #services_page #service-table .service_category_row { display: block; width: 100%; margin: 28px 0 0 }
  #services_page #service-table .service_category_row:first-child { margin-top: 0 }
  #services_page #service-table .service_category_row td { display: block; width: 100%; padding: 0; border: 0; background: #f8fbfe }
  #services_page .service_category_inner { min-height: 50px; padding: 0 15px }
  #services_page .service_category_name { font-size: 15px }
  #services_page #service-table .service_data_row { display: block; width: 100%; padding: 8px 16px; border: 1px solid rgba(91,153,235,.18); border-radius: 0; background: linear-gradient(145deg,rgba(6,35,77,.96),rgba(3,25,58,.96)); box-shadow: 0 10px 25px rgba(0,0,0,.12) }
  #services_page #service-table .service_data_row:hover { background: linear-gradient(145deg,rgba(8,43,94,.98),rgba(4,30,70,.98)) }
  #services_page #service-table .service_data_row td { display: flex; width: 100%; min-height: 46px; padding: 11px 0; border: 0; border-bottom: 1px solid rgba(97,151,222,.1); align-items: center; justify-content: space-between; text-align: right }
  #services_page #service-table .service_data_row td:last-child { border-bottom: 0 }
  #services_page #service-table .service_data_row td[data-label]:before { content: attr(data-label); flex: 0 0 135px; padding-right: 15px; color: #7693ba; font-family: 'Noto Sans TC',sans-serif; font-size: 14px; font-weight: 500; text-align: left }
  #services_page #service-table .service_data_row .service-name { display: block; padding-top: 14px; padding-bottom: 14px; text-align: left }
  #services_page #service-table .service_data_row .service-name:before { display: block; margin-bottom: 7px; padding: 0; color: #7693ba }
  #services_page #service-table .service_data_row .service-name { font-size: 15px; line-height: 1.7 }
  #services_page #service-table .favorite_td { display: flex; width: 100%; min-height: auto; padding: 8px 0; justify-content: flex-end; border-bottom: 0 }
  #services_page .service-description { display: flex!important }
  #services_page .service_detail_btn { min-width: 110px; height: 36px }
  #services_page .services_table_scroll::-webkit-scrollbar { display: none }
}
@media(max-width:767px) {
  #services_page { padding: 50px 0 65px }
  #services_page .services_head { margin-bottom: 28px }
  #services_page .services_title { font-size: 32px }
  #services_page .services_desc { font-size: 15px }
  #services_page .services_filter,#services_page .services_currency { width: calc(50% - 5px) }
  #services_page .services_filter .dropdown,#services_page .services_currency .dropdown { width: 100% }
  #services_page .services_filter .btn,#services_page .services_currency .btn { width: 100%; min-width: 0 }
  #services_page .dropdown-menu { max-width: 100%; max-height: 320px; width: 100%; margin: 0 }
  #services_page .services_text { padding: 22px 18px; font-size: 15px }
  #serviceDetailModal .service_detail_modal_dialog { width: calc(100% - 30px); max-width: none }
  #serviceDetailModal .service_detail_modal_head { padding: 22px 20px 18px }
  #serviceDetailModal .service_detail_modal_title { padding-right: 15px; font-size: 19px }
  #serviceDetailModal .service_detail_modal_body { max-height: 40vh; padding: 22px 20px; font-size: 15px }
  #serviceDetailModal .service_detail_modal_bottom { padding: 15px 20px 22px }
}
@media(max-width:500px) {
  #services_page .services_entitle { font-size: 10px }
  #services_page .services_title { font-size: 29px }
  #services_page .services_filter,#services_page .services_currency { width: 100% }
  #services_page #service-table .service_data_row { padding: 6px 14px }
  #services_page #service-table .service_data_row td[data-label]:before { padding-right: 10px }
  #services_page .service_id { min-width: 48px }
  #services_page .service_detail_btn { min-width: 105px; padding: 0 12px }
}
#terms_page { position: relative; width: 100%; min-height: 100vh; padding: 80px 0 100px; overflow: hidden; color: #fff }
#terms_page .container { position: relative; z-index: 2; width: 100% }
#terms_page .terms_wrap { width: 100%; max-width: 1180px; margin: 0 auto }
#terms_page .terms_notice { position: relative; margin-bottom: 32px; padding: 34px 38px; border-radius: 18px; overflow: hidden; background: #f8fbfe; box-shadow: 0 25px 70px rgba(2,39,100,.12) }
#terms_page .terms_notice:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg,#f7256a,#ff9f1c,#8b2cf5,#149cff) }
#terms_page .terms_notice_title { margin-bottom: 28px; color: var(--primary); font-size: 20px; font-weight: 700; line-height: 1.7; text-align: center }
#terms_page .terms_warning_list { display: grid; gap: 10px }
#terms_page .terms_warning_item { display: flex; align-items: flex-start; gap: 12px; border-radius: 10px; background: rgba(255,255,255,.035) }
#terms_page .terms_warning_icon { flex: 0 0 auto; margin-top: 3px; font-size: 17px; line-height: 1 }
#terms_page .terms_warning_item p { margin: 0; color: var(--black); font-size: 15px; line-height: 1.9 }
#terms_page .terms_red { color: #ff526f!important; font-weight: 700 }
#terms_page .terms_line_btn { display: inline-flex; margin-left: 8px; vertical-align: middle }
#terms_page .terms_line_btn img { display: block; width: auto; height: 28px }
#terms_page .terms_section { position: relative; margin-bottom: 32px; padding: 48px 52px 55px; border: 1px solid rgba(90,155,239,.16); border-radius: 18px; background: linear-gradient(145deg,rgba(5,31,72,.97),rgba(2,20,49,.98)); box-shadow: 0 30px 70px rgba(0,0,0,.2); overflow: hidden }
#terms_page .terms_section:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; border-radius: 18px 18px 0 0; background: linear-gradient(90deg,#22c7f2 0%,#149cff 30%,#8b2cf5 65%,#f7256a 100%) }
#terms_page .terms_section_title { position: relative; margin-bottom: 30px; padding-bottom: 18px; color: #fff; font-size: 25px; font-weight: 700; line-height: 1.4 }
#terms_page .terms_section_title:before { content: ""; position: absolute; left: 0; bottom: 0; width: 72px; height: 2px; background: linear-gradient(90deg,#149cff,#8b2cf5) }
#terms_page .terms_section_title:after { content: ""; position: absolute; left: 80px; bottom: 0; width: calc(100% - 80px); height: 1px; background: rgba(104,163,239,.15) }
#terms_page .terms_intro,#terms_page .privacy_intro { margin-bottom: 30px; color: #c4d1e4; font-size: 15px; line-height: 2; letter-spacing: 0.04em }
#terms_page .terms_rules { display: grid; gap: 12px }
#terms_page .terms_rule { display: grid; grid-template-columns: 54px minmax(0,1fr); gap: 20px; padding: 22px 0; border-bottom: 1px solid rgba(101,158,232,.12) }
#terms_page .terms_rule:last-child { border-bottom: 0 }
#terms_page .terms_rule_no { display: flex; align-items: center; justify-content: center; width: 50px; height: 32px; margin-top: 1px; border: 1px solid rgba(20,156,255,.32); border-radius: 20px; background: rgba(20,156,255,.07); color: #62bcff; font-family: 'Arimo'; font-size: 11px; font-weight: 700; letter-spacing: .08em }
#terms_page .terms_rule_content { min-width: 0; color: #bfcde1; font-size: 15px; line-height: 2 }
#terms_page .terms_rule_content p { margin: 0 0 10px; color: #bfcde1 }
#terms_page .terms_rule_content p:last-child { margin-bottom: 0 }
#terms_page .terms_important { margin-top: 18px; padding: 20px 22px; border: 1px solid rgba(247,37,106,.22); border-radius: 12px; background: rgba(247,37,106,.045) }
#terms_page .terms_privacy { margin-bottom: 0 }
#terms_page .privacy_item { position: relative; margin-top: 30px }
#terms_page .privacy_item h3 { margin: 0 0 14px; color: #fff; font-size: 17px; font-weight: 700; line-height: 1.6 }
#terms_page .privacy_item h3:before { content: ""; display: inline-block; width: 5px; height: 5px; margin: 0 10px 3px 0; border-radius: 50%; background: #149cff; box-shadow: 0 0 0 4px rgba(20,156,255,.1) }
#terms_page .privacy_item p { margin: 0 0 13px; color: #bfcde1; font-size: 15px; line-height: 2 }
#terms_page .privacy_item p:last-child { margin-bottom: 0 }
#terms_page .privacy_item ul { margin: 15px 0 0; padding: 0; list-style: none }
#terms_page .privacy_item li { position: relative; margin-bottom: 10px; padding-left: 20px; color: #bfcde1; font-size: 15px; line-height: 1.9 }
#terms_page .privacy_item li:before { content: ""; position: absolute; left: 2px; top: 12px; width: 6px; height: 3px; border-left: 2px solid #149cff; border-bottom: 2px solid #149cff; transform: rotate(-45deg) }
#terms_page .privacy_item li:last-child { margin-bottom: 0 }
@media(max-width:1024px) {
  #terms_page { padding: 65px 0 80px }
  #terms_page .terms_section { padding: 42px 40px 48px }
  #terms_page .terms_notice { padding: 30px 32px }
}
@media(max-width:767px) {
  #terms_page { padding: 45px 0 60px }
  #terms_page .terms_notice { margin-bottom: 20px; padding: 27px 20px; border-radius: 14px }
  #terms_page .terms_notice_title { margin-bottom: 22px; font-size: 18px; text-align: left }
  #terms_page .terms_warning_item p { font-size: 14px; line-height: 1.85 }
  #terms_page .terms_section { margin-bottom: 20px; padding: 35px 22px 40px; border-radius: 14px }
  #terms_page .terms_section_title { margin-bottom: 24px; font-size: 24px }
  #terms_page .terms_intro,#terms_page .privacy_intro { font-size: 14px; line-height: 1.9 }
  #terms_page .terms_rule { grid-template-columns: 1fr; gap: 10px; padding: 20px 0 }
  #terms_page .terms_rule_no { width: 46px; height: 28px }
  #terms_page .terms_rule_content { font-size: 14px; line-height: 1.9 }
  #terms_page .terms_important { padding: 0; border: 0; background: transparent; border-radius: 0 }
  #terms_page .privacy_item h3 { font-size: 16px }
  #terms_page .privacy_item p,#terms_page .privacy_item li { font-size: 14px; line-height: 1.9 }
}
@media(max-width:500px) {
  #terms_page { padding: 35px 0 50px }
  #terms_page .terms_notice { padding: 24px 16px }
  #terms_page .terms_warning_item { gap: 8px }
  #terms_page .terms_line_btn { display: block; width: max-content; margin: 10px 0 0 }
  #terms_page .terms_section { padding: 30px 17px 35px }
  #terms_page .terms_section_title { font-size: 22px }
}
#api_page { position: relative; width: 100%; min-height: 100vh; padding: 75px 0 100px; overflow: hidden; background: linear-gradient(145deg,#010c24 0%,#021a43 48%,#022764 100%); color: #fff }
#api_page .api_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; overflow: hidden }
#api_page .api_bg:before { content: ""; position: absolute; width: 760px; height: 760px; right: -350px; top: -350px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.18) 0%,rgba(20,156,255,.04) 42%,rgba(20,156,255,0) 72%) }
#api_page .api_bg:after { content: ""; position: absolute; width: 620px; height: 620px; left: -310px; bottom: -320px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.1) 0%,rgba(139,44,245,0) 70%) }
#api_page .container { position: relative; z-index: 2 }
#api_page .api_head { margin-bottom: 38px }
#api_page .api_entitle { margin-bottom: 10px; color: #b5caff; font-family: 'Raleway',sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .35em }
#api_page .api_title { color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em }
#api_page .api_desc { color: #9fb3d1; font-size: 15px; line-height: 1.9 }
#api_page .api_panel { position: relative; overflow: hidden; border: 1px solid rgba(83,151,239,.18); border-radius: 20px; background: linear-gradient(145deg,rgba(4,29,68,.97),rgba(2,20,49,.98)); box-shadow: 0 35px 90px rgba(0,0,0,.25) }
#api_page .api_panel_topline { position: absolute; left: 0; top: 0; z-index: 3; width: 100%; height: 3px; background: linear-gradient(90deg,#22c7f2 0%,#149cff 28%,#8b2cf5 58%,#f7256a 80%,#ff9f1c 100%) }
#api_page .api_block { padding: 42px 46px; border-bottom: 1px solid rgba(92,154,233,.12) }
#api_page .api_block:last-of-type { border-bottom: 0 }
#api_page .api_block_head { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 25px }
#api_page .api_block_entitle { margin-bottom: 6px; color: #55b9ff; font-family: 'Raleway',sans-serif; font-size: 10px; font-weight: 700; letter-spacing: .24em }
#api_page .api_block_title { margin: 0; color: #fff; font-size: 24px; font-weight: 700; line-height: 1.5 }
#api_page .api_info_grid { display: grid; grid-template-columns: repeat(2,1fr); border: 1px solid rgba(96,158,238,.14); border-radius: 14px; overflow: hidden }
#api_page .api_info_item { display: grid; grid-template-columns: 150px minmax(0,1fr); min-height: 64px; border-bottom: 1px solid rgba(96,158,238,.1) }
#api_page .api_info_item:nth-child(odd) { border-right: 1px solid rgba(96,158,238,.1) }
#api_page .api_info_item:nth-last-child(-n+2) { border-bottom: 0 }
#api_page .api_info_label { display: flex; align-items: center; padding: 15px 18px; background: rgba(20,156,255,.05); color: #7894ba; font-size: 13px; font-weight: 600 }
#api_page .api_info_value { display: flex; align-items: center; min-width: 0; padding: 15px 18px; color: #d2dced; font-size: 14px; word-break: break-all }
#api_page .api_info_value a { color: #55b9ff }
#api_page .api_info_value a:hover { color: #fff }
#api_page code { padding: 4px 8px; border-radius: 5px; background: rgba(20,156,255,.08); color: #6bc8ff; font-family: 'Courier New',monospace; font-size: 13px }
#api_page .api_badge { display: inline-flex; align-items: center; justify-content: center; min-width: 58px; height: 28px; padding: 0 12px; border: 1px solid rgba(34,199,242,.32); border-radius: 30px; background: rgba(34,199,242,.08); color: #61dcff; font-family: 'Raleway',sans-serif; font-size: 11px; font-weight: 700; letter-spacing: .08em }
#api_page .api_badge_alt { border-color: rgba(139,44,245,.35); background: rgba(139,44,245,.1); color: #c4a7ff }
#api_page .api_method_head { display: flex; align-items: center; gap: 18px; margin-bottom: 26px }
#api_page .api_method_no { display: flex; align-items: center; justify-content: center; flex: 0 0 48px; width: 48px; height: 48px; border: 1px solid rgba(20,156,255,.25); border-radius: 50%; background: rgba(20,156,255,.06); color: #55b9ff; font-family: 'Raleway',sans-serif; font-size: 11px; font-weight: 700; letter-spacing: .08em }
#api_page .api_method_title { margin: 0; color: #fff; font-size: 22px; font-weight: 700; line-height: 1.5 }
#api_page .api_type_select { display: flex; align-items: center; gap: 16px; margin-bottom: 22px; padding: 16px 18px; border: 1px solid rgba(94,157,238,.13); border-radius: 10px; background: rgba(255,255,255,.025) }
#api_page .api_type_select label { margin: 0; color: #90a8c9; font-size: 13px; font-weight: 600; white-space: nowrap }
#api_page .api_type_select .form-control { width: 100%; max-width: 340px; height: 42px; padding: 0 35px 0 14px; border: 1px solid rgba(89,158,247,.25); border-radius: 8px; background: #061a3c; color: #fff; box-shadow: none }
#api_page .api_type_select .form-control:focus { border-color: #149cff; box-shadow: 0 0 0 3px rgba(20,156,255,.08) }
#api_page .api_table { overflow: hidden; border: 1px solid rgba(94,157,238,.14); border-radius: 12px }
#api_page .api_table_head,#api_page .api_table_row { display: grid; grid-template-columns: 40% 60% }
#api_page .api_table_head { background: linear-gradient(90deg,#092c60 0%,#073777 100%) }
#api_page .api_table_head>div { padding: 14px 18px; color: #fff; font-size: 13px; font-weight: 700 }
#api_page .api_table_head>div:first-child,#api_page .api_table_row>div:first-child { border-right: 1px solid rgba(103,164,241,.12) }
#api_page .api_table_row { border-top: 1px solid rgba(96,158,238,.1); transition: .25s }
#api_page .api_table_row:hover { background: rgba(20,156,255,.05) }
#api_page .api_table_row>div { display: flex; align-items: center; min-width: 0; padding: 15px 18px; color: #b9c9df; font-size: 14px; line-height: 1.7 }
#api_page .api_parameter code { color: #72cfff }
#api_page .api_example { margin-top: 24px; overflow: hidden; border: 1px solid rgba(92,156,238,.15); border-radius: 12px; background: #010d22 }
#api_page .api_example_head { display: flex; align-items: center; justify-content: space-between; padding: 13px 17px; border-bottom: 1px solid rgba(91,157,241,.12); background: #061a3b; color: #fff; font-size: 13px; font-weight: 600 }
#api_page .api_example_type { color: #55b9ff; font-family: 'Raleway',sans-serif; font-size: 9px; font-weight: 700; letter-spacing: .14em }
#api_page .api_example pre { max-height: 420px; margin: 0; padding: 20px; overflow: auto; border: 0; border-radius: 0; background: transparent; color: #9ed8ff; font-family: 'Courier New',monospace; font-size: 13px; line-height: 1.8; white-space: pre-wrap; word-break: break-word }
#api_page .api_example pre::-webkit-scrollbar { width: 6px; height: 6px }
#api_page .api_example pre::-webkit-scrollbar-track { background: #020d20 }
#api_page .api_example pre::-webkit-scrollbar-thumb { border-radius: 10px; background: #155ab0 }
#api_page .api_bottom { padding: 30px 46px; text-align: center }
#api_page .api_php_btn { display: inline-flex; align-items: center; justify-content: center; gap: 14px; min-width: 210px; height: 48px; padding: 0 24px; border-radius: 40px; background: linear-gradient(90deg,#8b2cf5 0%,#149cff 100%); color: #fff; font-size: 14px; font-weight: 600; transition: .3s }
#api_page .api_php_btn i { font-style: normal; font-size: 18px; transition: .3s }
#api_page .api_php_btn:hover { color: #fff; background: linear-gradient(90deg,#149cff,#149cff) }
#api_page .api_php_btn:hover i { transform: translate(3px,-3px) }
body.api-sitebody { background: #010c24 }
@media(max-width:1024px) {
  #api_page { padding: 60px 0 80px }
  #api_page .api_block { padding: 36px 34px }
  #api_page .api_info_grid { grid-template-columns: 1fr }
  #api_page .api_info_item:nth-child(odd) { border-right: 0 }
  #api_page .api_info_item { border-bottom: 1px solid rgba(96,158,238,.1)!important }
  #api_page .api_info_item:last-child { border-bottom: 0!important }
  #api_page .api_bottom { padding: 28px 34px }
}
@media(max-width:767px) {
  #api_page { padding: 45px 0 60px }
  #api_page .api_head { margin-bottom: 28px }
  #api_page .api_title { font-size: 32px }
  #api_page .api_panel { border-radius: 14px }
  #api_page .api_block { padding: 30px 20px }
  #api_page .api_block_title { font-size: 21px }
  #api_page .api_info_item { grid-template-columns: 1fr }
  #api_page .api_info_label { padding: 11px 14px; border-bottom: 1px solid rgba(96,158,238,.08) }
  #api_page .api_info_value { padding: 13px 14px }
  #api_page .api_method_head { gap: 12px }
  #api_page .api_method_no { flex-basis: 42px; width: 42px; height: 42px }
  #api_page .api_method_title { font-size: 19px }
  #api_page .api_type_select { display: block; padding: 14px }
  #api_page .api_type_select label { display: block; margin-bottom: 8px }
  #api_page .api_type_select .form-control { max-width: none }
  #api_page .api_table { border: 0; overflow: visible }
  #api_page .api_table_head { display: none }
  #api_page .api_table_row { display: block; margin-bottom: 10px; padding: 14px; border: 1px solid rgba(94,157,238,.14); border-radius: 10px; background: rgba(255,255,255,.02) }
  #api_page .api_table_row>div { display: block; padding: 0; border: 0!important }
  #api_page .api_table_row .api_parameter { margin-bottom: 9px }
  #api_page .api_table_row .api_description { color: #b9c9df; line-height: 1.8 }
  #api_page .api_example pre { padding: 16px; font-size: 12px }
  #api_page .api_bottom { padding: 24px 20px; text-align: center }
  #api_page .api_php_btn { width: 100% }
}
@media(max-width:500px) {
  #api_page .api_title { font-size: 29px }
  #api_page .api_desc { font-size: 14px }
  #api_page .api_entitle { font-size: 10px }
}
#neworder_page { position: relative; width: 100%; min-height: 100vh; padding: 70px 0 100px; overflow: visible }
#neworder_page .neworder_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none }
#neworder_page .neworder_bg:before { content: ""; position: absolute; width: 760px; height: 760px; right: -360px; top: -360px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.18) 0%,rgba(20,156,255,.04) 43%,rgba(20,156,255,0) 72%) }
#neworder_page .neworder_bg:after { content: ""; position: absolute; width: 620px; height: 620px; left: -320px; bottom: -320px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.1) 0%,rgba(139,44,245,0) 70%) }
#neworder_page .container { position: relative; z-index: 2 }
#neworder_page .neworder_head { margin-bottom: 36px }
#neworder_page .neworder_entitle { margin-bottom: 10px; color: #b5caff; font-family: 'Raleway',sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .35em }
#neworder_page .neworder_title { color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em }
#neworder_page .neworder_desc { color: #9fb3d1; font-size: 15px; line-height: 1.9 }
#neworder_page .order_alert { margin-bottom: 22px; border: 0; border-radius: 12px; padding: 45px; font-size: 16px }
#neworder_page .order_alert h4 { margin-top: 0; color: red }
#neworder_page .order_layout { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(310px,.75fr); gap: 22px; align-items: start }
#neworder_page .order_main {position: relative;display: grid;gap: 0;height: 100%;padding: 50px;border-radius: 18px;background: #f8fbfe;box-shadow: 0 25px 70px rgba(2,39,100,.12);overflow: hidden}
#neworder_page .order_summary,#neworder_page .neworder_text { position: relative; border: 1px solid rgba(87,157,246,.17); border-radius: 18px; background: linear-gradient(145deg,rgba(5,31,72,.97),rgba(2,20,49,.98)); box-shadow: 0 25px 60px rgba(0,0,0,.2) }
#neworder_page .order_main:before,#neworder_page .order_summary:before,#neworder_page .neworder_text:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; border-radius: 18px 18px 0 0; background: linear-gradient(90deg,#22c7f2 0%,#149cff 28%,#8b2cf5 62%,#f7256a 100%) }
#neworder_page .order_card { position: relative }
#neworder_page .order_card_head,#neworder_page .order_summary_head { display: flex; align-items: center; gap: 15px; margin-bottom: 28px }
#neworder_page .order_card_entitle { margin-bottom: 3px; color: #7599c7; font-family: 'Raleway',sans-serif; font-size: 9px; font-weight: 700; letter-spacing: .22em }
#neworder_page .order_card_title { color: #fff; font-size: 19px; font-weight: 700; line-height: 1.4 }
#neworder_page .form-group { margin-bottom: 22px }
#neworder_page .form-group:last-child { margin-bottom: 0 }
#neworder_page .control-label { display: block; margin-bottom: 9px; color: var(--info); font-size: 14px; font-weight: 500; line-height: 1.6 }
#neworder_page .form-control { width: 100%; height: 52px; padding: 10px 15px; border: 1px solid rgba(105,164,239,.21); border-radius: 9px; background: transparent; color: #4a4a4a; box-shadow: none; font-size: 14px; transition: .3s }
#neworder_page .form-control:focus { border-color: #149cff; box-shadow: 0 0 0 3px rgba(20,156,255,.08) }
#neworder_page .form-control[readonly] { border-color: rgba(107,167,244,.12); background: #04152f; color: #6bc8ff; font-size: 17px; font-weight: 700 }
#neworder_page textarea.form-control { height: auto; min-height: 120px; resize: vertical }
#neworder_page select.form-control { cursor: pointer }
#neworder_page #fields .form-group { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid rgba(95,153,229,.1) }
#neworder_page #fields .form-group:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0 }
#neworder_page #fields .input-group { width: 100% }
#neworder_page #fields .input-group-addon { border: 1px solid rgba(105,164,239,.21); background: #092655; color: #8db9ec }
#neworder_page .order_sidebar { position: sticky; top: 100px; align-self: start; z-index: 5 }
#neworder_page .order_summary { padding: 30px 28px; overflow: hidden }
#neworder_page .order_summary_head { margin-bottom: 25px }
#neworder_page .order_description { margin-bottom: 24px }
#neworder_page .order_description .panel-body { max-height: 300px; padding: 18px; border: 1px solid rgba(92,157,239,.14)!important; border-radius: 10px!important; background: rgba(255,255,255,.025); color: #b8c8de; font-size: 13px; line-height: 1.9; overflow-y: auto }
#neworder_page .order_description .panel-body::-webkit-scrollbar { width: 5px }
#neworder_page .order_description .panel-body::-webkit-scrollbar-track { background: transparent }
#neworder_page .order_description .panel-body::-webkit-scrollbar-thumb { border-radius: 10px; background: #155ab0 }
#neworder_page .order_charge_box { margin-top: 5px; margin-bottom: 25px; padding: 20px; border: 1px solid rgba(20,156,255,.15); border-radius: 12px; background: linear-gradient(135deg,rgba(20,156,255,.07),rgba(139,44,245,.04)) }
#neworder_page .order_charge_box .control-label { margin-bottom: 10px; color: #8ca8cb }
#neworder_page .order_charge_input { position: relative }
#neworder_page .order_charge_input:before { content: "TOTAL"; position: absolute; right: 14px; top: 50%; z-index: 2; color: #55769f; font-family: 'Raleway',sans-serif; font-size: 8px; font-weight: 700; letter-spacing: .18em; transform: translateY(-50%); pointer-events: none }
#neworder_page .order_charge_input .form-control { padding-right: 70px; background: transparent!important; color: #fff; font-family: 'Arimo' }
#neworder_page .order_terms { margin: 22px 0!important; padding: 17px; border: 1px solid rgba(103,160,233,.12); border-radius: 10px; background: rgba(255,255,255,.025) }
#neworder_page .order_terms .terms { display: flex; align-items: flex-start; gap: 9px; margin: 0; color: #91a8c7; font-size: 12px; font-weight: 400; line-height: 1.7; cursor: pointer }
#neworder_page .order_terms input { flex: 0 0 auto; margin: 4px 0 0; accent-color: #149cff }
#neworder_page .order_terms a { color: #55b9ff; font-weight: 600 }
#neworder_page .order_terms a:hover { color: #fff }
#neworder_page .order_submit { display: flex; align-items: center; justify-content: center; width: 100%; height: 52px; padding: 0 22px; border: 0; border-radius: 50px; background: linear-gradient(90deg,#8b2cf5 0%,#149cff 100%); color: #fff; font-size: 15px; font-weight: 700; box-shadow: 0 12px 28px rgba(38,105,219,.2); transition: .35s }
#neworder_page .order_submit span { font-weight: 500 }
#neworder_page .order_submit:hover,#neworder_page .order_submit:focus { background: linear-gradient(90deg,#149cff,#0874df); color: #fff }
#neworder_page .neworder_text { margin-top: 22px; padding: 32px 34px }
#neworder_page .neworder_text_head { margin-bottom: 20px }
#neworder_page .neworder_text_entitle { margin-bottom: 4px; color: #7599c7; font-family: 'Raleway',sans-serif; font-size: 9px; font-weight: 700; letter-spacing: .22em }
#neworder_page .neworder_text_title { color: #fff; font-size: 19px; font-weight: 700 }
#neworder_page .neworder_text_content { color: #aebed5; font-size: 14px; line-height: 2 }
#neworder_page .neworder_text_content p { margin-bottom: 13px }
#neworder_page .neworder_text_content a { color: #55b9ff }
#neworder_page .neworder_text_content img { max-width: 100%; height: auto }
#neworder_page .select2-container { width: 100%!important }
#neworder_page .select2-container * { color: #3b3b3b }
#neworder_page .select2-container .select2-selection--single { background: #f8fbfe !important }
#neworder_page .select2-container .select2-selection--single .select2-selection__arrow { height: 50px!important; right: 10px!important }
#neworder_page .select2-container--focus .select2-selection--single,#neworder_page .select2-container--open .select2-selection--single { border-color: #149cff!important; box-shadow: 0 0 0 3px rgba(20,156,255,.08)!important }
.select2-dropdown { border: 1px solid rgba(72,149,246,.3)!important; border-radius: 9px!important; background: transparent !important; box-shadow: 0 20px 50px rgba(0,0,0,.35)!important; padding: 0; overflow: hidden }
.select2-results__option { padding: 10px 13px!important; color: #b9cbe3!important }
.select2-results__option--highlighted[aria-selected] { background: #0b4b99!important; color: #fff!important }
.select2-search--dropdown { padding: 8px!important }
.select2-search--dropdown .select2-search__field { height: 38px; padding: 6px 10px; border: 1px solid rgba(105,164,239,.2)!important; border-radius: 7px; background: #061a3c!important; color: #fff!important; outline: 0 }
body.neworder .select2-container .dropdown-menu > li > a { background: transparent; padding: 0 }
body.neworder .select2-results__option--highlighted[aria-selected] { background: #e9e9e9 !important }
body.neworder .select2-container .select2-selection__text { color: #555 }
.
#neworder_page .order_description_main { margin: 5px 0 24px }
#neworder_page .order_description_main .control-label { color: #405675 }
#neworder_page .order_description_main .panel-body { max-height: 280px; padding: 18px; border: 1px solid #d9e5f1!important; border-radius: 10px!important; background: #f1f6fb; color: #536982; font-size: 13px; line-height: 1.9; overflow-y: auto }
#neworder_page .order_description_main .panel-body::-webkit-scrollbar { width: 5px }
#neworder_page .order_description_main .panel-body::-webkit-scrollbar-track { background: transparent }
#neworder_page .order_description_main .panel-body::-webkit-scrollbar-thumb { border-radius: 10px; background: #9bb9d8 }
#neworder_page .order_balance_box { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 18px; padding: 18px 20px; border: 1px solid rgba(20,156,255,.18); border-radius: 12px; background: linear-gradient(135deg,rgba(20,156,255,.09) 0%,rgba(139,44,245,.06) 100%) }
#neworder_page .order_balance_info { display: flex; align-items: center; gap: 12px; min-width: 0 }
#neworder_page .order_balance_icon { display: flex; align-items: center; justify-content: center; flex: 0 0 40px; width: 40px; height: 40px; border: 1px solid rgba(20,156,255,.25); border-radius: 50%; background: rgba(20,156,255,.08); color: #62c6ff; font-size: 16px }
#neworder_page .order_balance_label { margin-bottom: 2px; color: #fff; font-size: 13px; font-weight: 600; line-height: 1.5 }
#neworder_page .order_balance_desc { color: #6687ad; font-family: 'Raleway',sans-serif; font-size: 8px; font-weight: 700; letter-spacing: .15em }
#neworder_page .order_balance_value { flex: 0 0 auto; color: #6bc8ff; font-family: 'Arimo','Noto Sans TC',sans-serif; font-size: 22px; font-weight: 700; line-height: 1.2; text-align: right }
@media(max-width:1024px) {
  #neworder_page { padding: 60px 0 80px }
  #neworder_page .order_layout { grid-template-columns: 1fr }
  #neworder_page .order_summary { position: relative; top: auto; align-self: auto; order: 2 }
  #neworder_page .order_sidebar { order: 2 }
}
@media(max-width:767px) {
  #neworder_page .order_description_main .panel-body { max-height: 240px; padding: 16px }
  #neworder_page { padding: 45px 0 60px }
  #neworder_page .neworder_head { margin-bottom: 28px }
  #neworder_page .neworder_title { font-size: 32px }
  #neworder_page .neworder_desc { font-size: 14px }
  #neworder_page .order_main {gap: 16px;padding: 5px;display: block;}
  #neworder_page .order_layout { gap: 16px }
  #neworder_page .order_card,#neworder_page .order_summary,#neworder_page .neworder_text { border-radius: 14px }
  #neworder_page .order_card { padding: 26px 20px }
  #neworder_page .order_summary { padding: 26px 20px }
  #neworder_page .order_card_head,#neworder_page .order_summary_head { margin-bottom: 23px }
  #neworder_page .order_card_no { flex-basis: 40px; width: 40px; height: 40px }
  #neworder_page .order_card_title { font-size: 18px }
  #neworder_page .form-group { margin-bottom: 18px }
  #neworder_page .form-control { height: 50px }
  #neworder_page .neworder_text { margin-top: 16px; padding: 26px 20px }
}
@media(max-width:500px) {
  #neworder_page .order_balance_box { padding: 15px; gap: 10px }
  #neworder_page .order_balance_icon { flex-basis: 36px; width: 36px; height: 36px; font-size: 14px }
  #neworder_page .order_balance_label { font-size: 12px }
  #neworder_page .order_balance_desc { font-size: 7px }
  #neworder_page .order_balance_value { font-size: 19px }
  #neworder_page .order_alert { padding: 25px; font-size: 15px }
  #neworder_page { padding: 35px 0 50px }
  #neworder_page .neworder_entitle { font-size: 9px }
  #neworder_page .neworder_title { font-size: 29px }
  #neworder_page .order_card,#neworder_page .order_summary { padding: 23px 16px }
  #neworder_page .order_charge_box { padding: 16px }
  #neworder_page .order_description .panel-body { max-height: 250px; padding: 15px }
  #neworder_page .order_submit { height: 50px }
}
#addfunds_page { position: relative; width: 100%; min-height: 100vh; padding: 70px 0 100px; overflow: hidden; background: linear-gradient(145deg,#010c24 0%,#021a43 50%,#022764 100%); color: #fff }
#addfunds_page .addfunds_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; overflow: hidden }
#addfunds_page .addfunds_bg:before { content: ""; position: absolute; width: 760px; height: 760px; right: -350px; top: -350px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.18) 0%,rgba(20,156,255,.04) 43%,rgba(20,156,255,0) 72%) }
#addfunds_page .addfunds_bg:after { content: ""; position: absolute; width: 620px; height: 620px; left: -320px; bottom: -300px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.1) 0%,rgba(139,44,245,0) 70%) }
#addfunds_page .container { position: relative; z-index: 2 }
#addfunds_page .addfunds_head { margin-bottom: 36px }
#addfunds_page .addfunds_entitle { margin-bottom: 10px; color: #b5caff; font-family: 'Raleway',sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .35em }
#addfunds_page .addfunds_title { color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em }
#addfunds_page .addfunds_desc { color: #9fb3d1; font-size: 15px; line-height: 1.9 }
#addfunds_page .addfunds_alert { margin-bottom: 22px; border: 0; border-radius: 12px }
#addfunds_page .addfunds_layout { display: grid; grid-template-columns: 1fr; gap: 22px; align-items: start }
#addfunds_page .addfunds_form_card { position: relative; padding: 45px; border-radius: 18px; background: #f8fbfe; box-shadow: 0 25px 70px rgba(0,0,0,.16); overflow: hidden }
#addfunds_page .addfunds_form_card:before,#addfunds_page .addfunds_info_card:before,#addfunds_page .addfunds_history:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; border-radius: 18px 18px 0 0; background: linear-gradient(90deg,#22c7f2 0%,#149cff 28%,#8b2cf5 62%,#f7256a 100%) }
#addfunds_page .addfunds_card_head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px }
#addfunds_page .addfunds_card_entitle { margin-bottom: 4px; color: #7599c7; font-family: 'Raleway',sans-serif; font-size: 9px; font-weight: 700; letter-spacing: .22em }
#addfunds_page .addfunds_form_card .addfunds_card_title { color: #152540; font-size: 21px; font-weight: 700; line-height: 1.4 }
#addfunds_page .form-group { margin-bottom: 24px }
#addfunds_page .control-label { display: block; margin-bottom: 9px; color: var(--info); font-size: 14px; font-weight: 500; line-height: 1.6 }
#addfunds_page .form-control { width: 100%; height: 54px; padding: 10px 16px; border: 1px solid #cedbea; border-radius: 9px; background: #f8fbfe; color: #152540; font-size: 14px; box-shadow: none; outline: none; transition: .3s }
#addfunds_page .form-control:hover { border-color: #8fbce7 }
#addfunds_page .form-control:focus { border-color: #149cff; box-shadow: 0 0 0 3px rgba(20,156,255,.08) }
#addfunds_page .addfunds_select_box { position: relative; margin-bottom: 20px }
#addfunds_page .addfunds_select_box:after { content: ""; position: absolute; right: 18px; top: 50%; width: 7px; height: 7px; border-right: 2px solid #607a9e; border-bottom: 2px solid #607a9e; transform: translateY(-70%) rotate(45deg); pointer-events: none }
#addfunds_page .addfunds_select_box select { padding-right: 46px; cursor: pointer; appearance: none; -webkit-appearance: none; -moz-appearance: none }
#addfunds_page .addfunds_amount_box { position: relative }
#addfunds_page .addfunds_amount_box .form-control { padding-right: 85px; font-family: 'Arimo','Noto Sans TC',sans-serif; font-size: 17px; font-weight: 600 }
#addfunds_page .addfunds_submit { display: flex; align-items: center; justify-content: center; width: min(100%,300px); height: 54px; margin: 8px auto 0; padding: 0 24px; border: 0; border-radius: 50px; background: linear-gradient(90deg,#8b2cf5 0%,#149cff 100%); color: #fff; font-size: 15px; font-weight: 600; transition: .35s }
#addfunds_page .addfunds_submit i { font-style: normal; font-size: 20px; transition: .35s }
#addfunds_page .addfunds_submit:hover,#addfunds_page .addfunds_submit:focus { background: linear-gradient(90deg,#149cff,#0874df); color: #fff }
#addfunds_page .addfunds_submit:hover i { transform: translateX(5px) }
#addfunds_page .addfunds_info_card { padding: 30px 28px; border: 1px solid rgba(87,157,246,.17); border-radius: 18px; background: linear-gradient(145deg,rgba(5,31,72,.97),rgba(2,20,49,.98)); box-shadow: 0 25px 60px rgba(0,0,0,.2); overflow: hidden; position: relative }
#addfunds_page .addfunds_info_head { display: flex; align-items: center; gap: 13px; margin-bottom: 24px }
#addfunds_page .addfunds_info_icon { display: flex; align-items: center; justify-content: center; flex: 0 0 42px; width: 42px; height: 42px; border: 1px solid rgba(20,156,255,.28); border-radius: 50%; background: rgba(20,156,255,.08); color: #62c6ff; font-size: 15px }
#addfunds_page .addfunds_info_card .addfunds_card_title { color: #fff; font-size: 30px; font-weight: 600; text-align: center; line-height: 1.28; letter-spacing: -.02em }
#addfunds_page .addfunds_info_content { color: #aebed5; font-size: 13px; line-height: 2 }
#addfunds_page .addfunds_info_content p { margin: 0 0 14px }
#addfunds_page .addfunds_info_content p:last-child { margin-bottom: 0 }
#addfunds_page .addfunds_info_content a:hover { color: #fff }
#addfunds_page .addfunds_info_content img { max-width: 100%; height: auto }
#addfunds_page .addfunds_history { position: relative; margin-top: 22px; padding: 36px 40px 28px; border-radius: 18px; background: #f8fbfe; box-shadow: 0 25px 70px rgba(0,0,0,.13); overflow: hidden }
#addfunds_page .addfunds_history_head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 27px }
#addfunds_page .addfunds_history_title { color: #152540; font-size: 21px; font-weight: 700 }
#addfunds_page .addfunds_history_note { color: #899bb2; font-size: 12px }
#addfunds_page .addfunds_table_wrap { width: 100% }
#addfunds_page .addfunds_table { width: 100%; margin: 0; border-collapse: separate; border-spacing: 0 }
#addfunds_page .addfunds_table thead th { padding: 13px 15px; border: 0; border-bottom: 1px solid #dce7f2; background: #eef5fb; color: #6b809a; font-size: 11px; font-weight: 600; letter-spacing: .05em; vertical-align: middle }
#addfunds_page .addfunds_table thead th:first-child { border-radius: 9px 0 0 9px }
#addfunds_page .addfunds_table thead th:last-child { border-radius: 0 9px 9px 0 }
#addfunds_page .addfunds_table tbody td { padding: 17px 15px; border: 0; border-bottom: 1px solid #e5edf5; color: #405675; font-size: 13px; vertical-align: middle }
#addfunds_page .addfunds_table tbody tr:last-child td { border-bottom: 0 }
#addfunds_page .addfunds_table tbody tr { transition: .25s }
#addfunds_page .addfunds_table tbody tr:hover { background: #f1f7fc }
#addfunds_page .payment_id { color: #149cff; font-family: 'Arimo',sans-serif; font-weight: 600 }
#addfunds_page .payment_amount { color: #0b3f91; font-family: 'Arimo','Noto Sans TC',sans-serif; font-size: 14px; font-weight: 700 }
#addfunds_page .nowrap { white-space: nowrap }
#addfunds_page .addfunds_pagination { display: flex; justify-content: center; margin-top: 26px }
#addfunds_page .pagination { margin: 0 }
#addfunds_page .pagination>li>a,#addfunds_page .pagination>li>span { min-width: 38px; height: 38px; margin: 0 3px; padding: 0 10px; border: 1px solid #d9e5f1; border-radius: 7px; background: #fff; color: #58718d; line-height: 36px; text-align: center }
#addfunds_page .pagination>li>a:hover { border-color: #149cff; background: #edf7ff; color: #149cff }
#addfunds_page .pagination>.active>a,#addfunds_page .pagination>.active>a:hover { border-color: #149cff; background: #149cff; color: #fff }
body.addfunds { background: #010c24 }
@media(max-width:1024px) {
  #addfunds_page { padding: 60px 0 80px }
  #addfunds_page .addfunds_layout.has_info { grid-template-columns: 1fr }
  #addfunds_page .addfunds_info_card { position: relative; top: auto }
}
@media(max-width:767px) {
  #addfunds_page { padding: 45px 0 60px }
  #addfunds_page .addfunds_head { margin-bottom: 28px }
  #addfunds_page .addfunds_title { font-size: 32px }
  #addfunds_page .addfunds_desc { font-size: 14px }
  #addfunds_page .addfunds_form_card { padding: 30px 22px; border-radius: 14px }
  #addfunds_page .addfunds_info_card { padding: 26px 20px; border-radius: 14px }
  #addfunds_page .addfunds_history { margin-top: 16px; padding: 28px 22px; border-radius: 14px }
  #addfunds_page .addfunds_history_head { align-items: flex-start; flex-direction: column; gap: 5px }
  #addfunds_page .form-control { height: 50px }
  #addfunds_page .addfunds_submit { height: 50px }
  #addfunds_page .addfunds_table thead { display: none }
  #addfunds_page .addfunds_table,#addfunds_page .addfunds_table tbody,#addfunds_page .addfunds_table tr,#addfunds_page .addfunds_table td { display: block; width: 100% }
  #addfunds_page .addfunds_table tbody tr { margin-bottom: 13px; padding: 10px 15px; border: 1px solid #e0eaf4; border-radius: 11px; background: #fff }
  #addfunds_page .addfunds_table tbody tr:last-child { margin-bottom: 0 }
  #addfunds_page .addfunds_table tbody td { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 9px 0; border-bottom: 1px solid #edf2f7; text-align: right }
  #addfunds_page .addfunds_table tbody td:last-child { border-bottom: 0 }
  #addfunds_page .addfunds_table tbody td:before { content: attr(data-label); flex: 0 0 auto; color: #8799ae; font-size: 11px; font-weight: 600; text-align: left }
}
@media(max-width:500px) {
  #addfunds_page { padding: 35px 0 50px }
  #addfunds_page .addfunds_entitle { font-size: 9px }
  #addfunds_page .addfunds_title { font-size: 29px }
  #addfunds_page .addfunds_form_card { padding: 25px 16px }
  #addfunds_page .addfunds_info_card { padding: 23px 16px }
  #addfunds_page .addfunds_history { padding: 25px 16px }
  #addfunds_page .addfunds_history_title { font-size: 19px }
}
#addfunds_page .addfunds_info_content { color: #aebed5; font-size: 14px; line-height: 1.9 }
#addfunds_page .fund_info { width: 100% }
#addfunds_page .fund_section { padding-bottom: 34px; margin-bottom: 34px; border-bottom: 1px solid rgba(105,164,239,.13) }
#addfunds_page .fund_section:last-child { margin-bottom: 0 }
#addfunds_page .fund_section_head { margin-bottom: 22px }
#addfunds_page .fund_section_en { margin-bottom: 5px; color: #5f88bb; font-family: 'Raleway',sans-serif; font-size: 10px; font-weight: 700; letter-spacing: .22em }
#addfunds_page .fund_section_head h3,#addfunds_page .fund_invoice_head h3 { margin: 0; color: #fff; font-size: 20px; font-weight: 700; line-height: 1.5 }
#addfunds_page .fund_section_head p { margin: 7px 0 0; color: #8099ba; line-height: 1.8 }
#addfunds_page .fund_method_grid { display: grid; grid-template-columns: 1fr; gap: 14px }
#addfunds_page .fund_method_card { padding: 20px; border: 1px solid rgba(89,157,244,.14); border-radius: 12px; background: rgba(255,255,255,.025) }
#addfunds_page .fund_method_top { display: flex; align-items: center; gap: 18px }
#addfunds_page .fund_method_top >div { display: flex; gap: 15px; flex-wrap: wrap }
#addfunds_page .fund_method_icon { display: flex; align-items: center; justify-content: center; flex: 0 0 70px; width: 70px; height: 70px; border: 1px solid rgba(20,156,255,.22); border-radius: 50%; background: rgba(20,156,255,.08); color: #65c7ff; font-size: 21px }
#addfunds_page .fund_method_tag { display: inline-flex; align-items: center; padding: 4px 17px; border-radius: 20px; background: linear-gradient(90deg,#149cff,#0874df); color: white; font-size: 13px; font-weight: 700; letter-spacing: .08em }
#addfunds_page .fund_method_tag.manual { background: linear-gradient(90deg,var(--triadic1),#d7830f) }
#addfunds_page .fund_method_card h4 { margin: 0; color: #fff; font-size: 18px; font-weight: 600; line-height: 1.6 }
#addfunds_page .fund_method_text { margin-top: 14px; color: white; line-height: 1.9 }
#addfunds_page .fund_method_text p { margin: 0 }
#addfunds_page .fund_bank_box { margin-top: 16px; padding: 13px 15px; border: 1px solid rgba(20,156,255,.13); border-radius: 9px; background: #031a3d }
#addfunds_page .fund_bank_label { margin-bottom: 5px; color: #6f8caf }
#addfunds_page .fund_bank_value { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start; gap: 0; flex-direction: column }
#addfunds_page .fund_bank_value span { color: white; font-size: 17px; font-family: 'Arimo','Noto Sans TC'; line-height: 1; margin-top: 7px }
#addfunds_page .fund_bank_value strong { color: #63c9ff; font-family: 'Arimo',sans-serif; font-size: 22px; font-weight: 700; letter-spacing: .04em }
#addfunds_page .fund_line_btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 47px; margin-top: 16px; border-radius: 8px; background: #06c755; color: #fff; font-size: 14px; font-weight: 600; text-decoration: none; transition: .3s }
#addfunds_page .fund_line_btn:hover { background: #08b94f; color: #fff }
#addfunds_page .fund_line_btn i { font-size: 17px }
#addfunds_page .fund_detail_list { display: grid; gap: 19px; grid-template-columns: 1fr 1fr }
#addfunds_page .fund_detail_item { padding: 18px; border: 1px solid rgba(89,157,244,.13); border-radius: 11px; background: rgba(255,255,255,.025) }
#addfunds_page .fund_detail_title { display: flex; align-items: center; gap: 11px; margin-bottom: 13px }
#addfunds_page .fund_detail_no { display: flex; align-items: center; justify-content: center; flex: 0 0 42px; width: 42px; height: 42px; border-radius: 50%; background: rgba(20,156,255,.08); color: #58c1ff; font-family: 'Arimo',sans-serif; font-size: 14px; font-weight: 700 }
#addfunds_page .fund_detail_small { margin-bottom: 1px; color: #587ca8; font-family: 'Raleway',sans-serif; font-size: 9px; font-weight: 700; letter-spacing: .15em }
#addfunds_page .fund_detail_title h4 { margin: 0; color: #fff; font-size: 16px; font-weight: 600 }
#addfunds_page .fund_detail_content { line-height: 1.9; color: white }
#addfunds_page .fund_detail_content p { margin: 0; height: 53px }
#addfunds_page .fund_bonus { display: flex; align-items: center; gap: 7px; margin-top: 10px; padding: 9px 19px; border-radius: 8px; background: var(--complement); color: white; font-size: 14px; font-weight: 600 }
#addfunds_page .fund_text_link { display: flex; align-items: center; gap: 7px; margin-top: 10px; padding: 9px 19px; border-radius: 8px; background: #00c860; color: white; font-size: 14px; font-weight: 600; justify-content: center }
#addfunds_page .fund_text_link:hover { color: #69ec9b }
#addfunds_page .fund_invoice_section { padding: 24px; border: 1px solid rgba(139,44,245,.16); border-radius: 14px; background: linear-gradient(145deg,rgba(139,44,245,.07),rgba(20,156,255,.04)) }
#addfunds_page .fund_invoice_head { display: flex; align-items: center; gap: 16px; margin-bottom: 20px }
#addfunds_page .fund_invoice_icon { display: flex; align-items: center; justify-content: center; flex: 0 0 70px; width: 70px; height: 70px; font-size: 21px; border: 1px solid rgba(20,156,255,.22); border-radius: 50%; background: rgba(20,156,255,.08); color: #65c7ff }
#addfunds_page .fund_invoice_grid { display: grid; gap: 12px }
#addfunds_page .fund_invoice_card { padding: 16px; border: 1px solid rgba(105,164,239,.11); border-radius: 10px; background: rgba(255,255,255,.025) }
#addfunds_page .fund_invoice_card.important { border-color: rgba(247,37,106,.2); background: rgba(247,37,106,.045) }
#addfunds_page .fund_invoice_label { margin-bottom: 8px; color: #fff; font-size: 17px; font-weight: 700 }
#addfunds_page .fund_invoice_card.important .fund_invoice_label { color: #ff789d }
#addfunds_page .fund_invoice_card p { margin: 0 0 6px; color: #9fb2ca; line-height: 1.8 }
#addfunds_page .fund_invoice_card p:last-child { margin-bottom: 0 }
#addfunds_page .fund_notice_item { display: flex; align-items: center; gap: 9px; margin-bottom: 2px }
#addfunds_page .fund_notice_item:last-of-type { margin-bottom: 14px }
#addfunds_page .fund_notice_dot { flex: 0 0 6px; width: 6px; height: 6px; border-radius: 50%; background: #f7256a }
#addfunds_page .fund_notice p { margin: 0; color: var(--dark); font-size: 14px; line-height: 1.9; text-align: left }
#addfunds_page .fund_notice_text { margin-top: 14px; padding: 12px 14px; border-radius: 8px; background: rgba(20,156,255,.06) }
#addfunds_page .fund_notice_text strong {color: var(--info);font-weight: 700}
#addfunds_page .fund_notice_alert { margin-top: 10px; padding: 12px 14px; border-left: 3px solid #f7256a; border-radius: 6px; background: rgba(247,37,106,.05) }
#addfunds_page .fund_notice_note { margin-top: 10px; padding-left: 15px; position: relative }
#addfunds_page .fund_notice_note:before { content: ""; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; border-radius: 50%; background: #149cff }
#addfunds_page .manual_fund * { text-align: left }
#addfunds_page .manual_fund_head { margin-bottom: 22px }
#addfunds_page .manual_fund_head h3 { margin: 0; font-size: 19px; font-weight: 700 }
#addfunds_page .manual_step { display: flex; gap: 14px; padding: 18px 0; border-bottom: 1px solid rgba(105,164,239,.12) }
#addfunds_page .manual_step_no { display: flex; align-items: center; justify-content: center; flex: 0 0 36px; width: 36px; height: 36px; border-radius: 50%; background: rgba(20,156,255,.09); color: var(--secondary); font-family: 'Arimo',sans-serif; font-size: 10px; font-weight: 700 }
#addfunds_page .manual_step_content { flex: 1; min-width: 0 }
#addfunds_page .manual_step_content h4 { margin: 0 0 7px; font-size: 14px; font-weight: 600 }
#addfunds_page .manual_step_content p { margin: 0; font-size: 14px; line-height: 1.9 }
#addfunds_page .manual_bank { display: flex; align-items: center; justify-content: flex-start; gap: 10px; margin-top: 12px; padding: 11px 13px; border-radius: 8px; background: #031a3d }
#addfunds_page .manual_bank span { color: #ced2d7; font-size: 13px }
#addfunds_page .manual_bank strong { color: #63c9ff; font-family: 'Arimo',sans-serif; font-size: 16px; letter-spacing: .04em }
#addfunds_page .manual_line { color: #36d876; font-weight: 700 }
#addfunds_page .manual_line:hover { color: #69ec9b }
#addfunds_page .manual_note { margin-top: 2px; color: #7f97b7; font-size: 12px }
#addfunds_page .manual_info_list { display: grid; margin-top: 13px }
#addfunds_page .manual_info_item { display: flex; align-items: center; gap: 9px; font-size: 14px }
#addfunds_page .manual_info_item span { flex: 0 0 6px; width: 6px; height: 6px; border-radius: 50%; background: #f7256a }
#addfunds_page .manual_warning { margin-top: 18px; padding: 15px 16px; border-left: 3px solid #f7256a; border-radius: 7px; background: rgba(247,37,106,.05) }
#addfunds_page .manual_warning_title { margin-bottom: 3px; color: var(--complement); font-size: 14px; font-weight: 700 }
#addfunds_page .manual_warning p { margin: 0; font-size: 13px; line-height: 1.8 }
#addfunds_page .manual_warning p:last-child { margin-bottom: 0 }
#addfunds_page .manual_warning strong { color: var(--complement) }
@media(max-width:1024px) {
  #addfunds_page .fund_detail_list { grid-template-columns: 1fr }
  #addfunds_page .fund_detail_content p { height: auto }
}
@media(max-width:767px) {
  #addfunds_page .fund_method_grid { grid-template-columns: 1fr }
  #addfunds_page .fund_invoice_section { padding: 20px }
}
@media(max-width:500px) {
  #addfunds_page .fund_method_top >div { gap: 5px; display: flex; flex-direction: column; align-items: flex-start }
  #addfunds_page .fund_method_top .fund_method_icon { display: none }
  #addfunds_page .fund_method_card,#addfunds_page .fund_detail_item { padding: 16px }
  #addfunds_page .fund_bank_value { align-items: flex-start; flex-direction: column }
  #addfunds_page .fund_invoice_section { padding: 17px }
  #addfunds_page .fund_method_top { display: flex; flex-direction: column; align-items: flex-start; gap: 5px }
  #addfunds_page .manual_step { gap: 11px }
  #addfunds_page .manual_bank { align-items: flex-start; flex-direction: column }
}
#orders_page { position: relative; width: 100%; min-height: 100vh; padding: 70px 0 100px; overflow: hidden; background: linear-gradient(145deg,#010c24 0%,#021a43 50%,#022764 100%); color: #fff }
#orders_page .orders_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none }
#orders_page .orders_bg:before { content: ""; position: absolute; width: 760px; height: 760px; right: -350px; top: -350px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.18) 0%,rgba(20,156,255,.04) 43%,rgba(20,156,255,0) 72%) }
#orders_page .orders_bg:after { content: ""; position: absolute; width: 650px; height: 650px; left: -350px; bottom: -340px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.1) 0%,rgba(139,44,245,0) 70%) }
#orders_page .container { position: relative; z-index: 2 }
#orders_page .orders_head { margin-bottom: 34px }
#orders_page .orders_entitle { margin-bottom: 10px; color: #b5caff; font-family: 'Raleway',sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .35em }
#orders_page .orders_title { color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em }
#orders_page .orders_desc { color: #9fb3d1; font-size: 15px; line-height: 1.9 }
#orders_page .orders_toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 30px }
#orders_page .orders_status_nav { display: flex; flex-wrap: wrap; gap: 7px; min-width: 0 }
#orders_page .orders_status_nav a { display: flex; align-items: center; justify-content: center; min-height: 38px; padding: 0 15px; border: 1px solid rgba(107,166,239,.16); border-radius: 50px; background: rgba(255,255,255,.035); color: #9eb4cf; font-size: 14px; font-weight: 500; text-decoration: none; transition: .3s }
#orders_page .orders_status_nav a:hover { border-color: rgba(20,156,255,.45); background: rgba(20,156,255,.08); color: #fff }
#orders_page .orders_status_nav a.active { border-color: #149cff; background: #149cff; color: #fff; box-shadow: 0 8px 20px rgba(20,99,214,.16) }
#orders_page .orders_search { flex: 0 0 360px; width: 360px; margin: 0 }
#orders_page .orders_search_box { position: relative; display: flex; align-items: stretch; width: 100%; height: 48px; border: 1px solid rgba(65,127,207,.42); border-radius: 10px; background: #071b43; overflow: hidden; transition: .3s }
#orders_page .orders_search_box:focus-within { border-color: #149cff; box-shadow: 0 0 0 3px rgba(20,156,255,.08) }
#orders_page .orders_search_box>i { display: none }
#orders_page .orders_search_box .form-control { flex: 1; min-width: 0; height: 46px; padding: 0 18px; border: 0; border-radius: 0; background: transparent!important; color: #fff; font-size: 16px; box-shadow: none!important; outline: none }
#orders_page .orders_search_box .form-control:focus { border: 0; background: transparent!important; box-shadow: none!important }
#orders_page .orders_search_box .form-control::placeholder { color: #7189aa; opacity: 1 }
#orders_page .orders_search_box button { position: relative; right: auto; top: auto; display: flex; align-items: center; justify-content: center; flex: 0 0 58px; width: 58px; height: 48px; margin: -1px -1px -1px 0; padding: 0; border: 0; border-radius: 0 10px 10px 0; background: linear-gradient(135deg,#159fff 0%,#176edc 100%); color: #fff; font-size: 0; cursor: pointer; transition: .3s }
#orders_page .orders_search_box button:hover { background: linear-gradient(135deg,#2aabff 0%,#0b5fca 100%) }
#orders_page .orders_search_box button i { display: block; color: #fff; font-size: 16px }
#orders_page .orders_panel { position: relative; border-radius: 18px; box-shadow: 0 25px 70px rgba(0,0,0,.16); overflow: hidden }
#orders_page .orders_table_wrap { width: 100%; overflow: visible }
#orders_page .orders_table { width: 100%; margin: 0; border-collapse: separate; border-spacing: 0; table-layout: auto; background: transparent }
#orders_page .orders_table thead th { padding: 18px 16px; border: 0; border-bottom: 1px solid #dce7f2; background: var(--secondary); line-height: 1.5; white-space: nowrap; vertical-align: middle; color: #fff; font-size: 14px; font-weight: 700 }
#orders_page .orders_table tbody td { padding: 18px 16px; border: 0; border-bottom: 1px solid #e5edf5; color: #405675; font-size: 14px; line-height: 1.7; vertical-align: middle }
#orders_page .orders_table tbody tr { transition: .25s; background: #f8fbfe }
#orders_page .orders_table tbody tr:hover { background: #f1f7fc }
#orders_page .orders_table tbody tr:last-child td { border-bottom: 0; font-family: 'Arimo' }
#orders_page .orders_id { color: #149cff; font-family: 'Arimo',sans-serif; font-weight: 700 }
#orders_page .orders_date { color: #72879f; white-space: nowrap; font-family: 'Arimo' }
#orders_page .orders_charge { color: #0b3f91; font-family: 'Arimo','Noto Sans TC',sans-serif; font-weight: 700; white-space: nowrap }
#orders_page .orders_quantity { font-family: 'Arimo',sans-serif; font-weight: 600 }
#orders_page .orders_service_cell { max-width: 240px }
#orders_page .orders_service { color: #304866; font-weight: 500; line-height: 1.7 }
#orders_page .orders_link_cell { max-width: 210px }
#orders_page .orders_link { display: flex; align-items: center; gap: 7px; min-width: 0 }
#orders_page .orders_link_url {display: block;min-width: 0;color: #56718e;text-overflow: ellipsis;text-decoration: none;transition: .25s;word-break: break-all;}
#orders_page .orders_link_url:hover { color: #149cff; text-decoration: underline }
#orders_page .orders_detail_buttons { display: flex; flex: 0 0 auto; gap: 4px }
#orders_page .orders_detail_btn { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: 1px solid #d5e2ef; border-radius: 50%; background: #fff; color: #149cff; font-size: 11px; transition: .3s }
#orders_page .orders_detail_btn:hover { border-color: #149cff; background: #149cff; color: #fff }
#orders_page .orders_status { display: flex; align-items: center; gap: 7px; white-space: nowrap }
#orders_page .orders_status_dot { flex: 0 0 6px; width: 6px; height: 6px; border-radius: 50%; background: #149cff; box-shadow: 0 0 0 3px rgba(20,156,255,.1) }
#orders_page .orders_status i { color: #f7256a; cursor: help }
#orders_page .order-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 5px }
#orders_page .orders_action_btn { display: inline-flex; align-items: center; justify-content: center; min-height: 29px; padding: 0 10px; border: 0; border-radius: 50px; font-size: 10px; font-weight: 600; text-decoration: none; transition: .3s }
#orders_page .orders_action_btn.refill { background: #149cff; color: #fff }
#orders_page .orders_action_btn.refill:hover { background: #0874df; color: #fff }
#orders_page .orders_action_btn.cancel { border: 1px solid #d9e2ec; background: #fff; color: #75879b }
#orders_page .orders_action_btn.cancel:hover { border-color: #f7256a; color: #f7256a }
#orders_page .orders_action_btn.disabled { opacity: .45; cursor: not-allowed }
#orders_page .orders_refilling { color: #149cff; font-size: 10px; font-weight: 600 }
#orders_page .orders_pagination { display: flex; justify-content: center; margin-top: 28px }
#orders_page .pagination { margin: 0 }
#orders_page .pagination>li>a,#orders_page .pagination>li>span { min-width: 38px; height: 38px; margin: 0 3px; padding: 0 10px; border: 1px solid rgba(105,164,239,.2); border-radius: 8px; background: rgba(255,255,255,.05); color: #9cb5d4; line-height: 36px; text-align: center }
#orders_page .pagination>li>a:hover { border-color: #149cff; background: #149cff; color: #fff }
#orders_page .pagination>.active>a,#orders_page .pagination>.active>a:hover { border-color: #149cff; background: linear-gradient(90deg,#8b2cf5,#149cff); color: #fff }
#orders_page .order_detail_modal .modal-dialog { width: 92%; max-width: 620px; margin: 80px auto }
#orders_page .order_detail_modal .modal-content { overflow: hidden; border: 1px solid rgba(105,164,239,.2); border-radius: 16px; background: #041936; box-shadow: 0 25px 70px rgba(0,0,0,.4) }
#orders_page .order_detail_modal .modal-header { display: flex; align-items: center; justify-content: space-between; padding: 22px 24px; border-bottom: 1px solid rgba(105,164,239,.12) }
#orders_page .order_modal_en { margin-bottom: 3px; color: #6589b7; font-family: 'Raleway',sans-serif; font-size: 8px; font-weight: 700; letter-spacing: .2em }
#orders_page .order_detail_modal .modal-title { margin: 0; color: #fff; font-size: 18px; font-weight: 700 }
#orders_page .order_detail_modal .close { margin: 0; color: #fff; font-size: 28px; font-weight: 300; opacity: .65; text-shadow: none }
#orders_page .order_detail_modal .close:hover { opacity: 1 }
#orders_page .order_detail_modal .modal-body { padding: 24px }
#orders_page .order_detail_modal .form-group { margin-bottom: 18px }
#orders_page .order_detail_modal .form-group:last-child { margin-bottom: 0 }
#orders_page .order_detail_modal label { display: block; margin-bottom: 8px; color: #a9bdd6; font-size: 12px; font-weight: 600 }
#orders_page .order_detail_modal .form-control { height: 48px; border: 1px solid rgba(105,164,239,.18); border-radius: 8px; background: #061f47; color: #bcd0e8; box-shadow: none }
#orders_page .order_detail_modal textarea.form-control { height: auto; min-height: 140px; resize: vertical }
body.orders { background: #010c24 }
@media(max-width:1200px) {
  #orders_page .orders_table thead th,#orders_page .orders_table tbody td { padding-left: 7px; padding-right: 7px }
  #orders_page .orders_service_cell { max-width: 180px }
  #orders_page .orders_link_cell { max-width: 150px }
}
@media(max-width:1024px) {
  #orders_page { padding: 60px 0 80px }
  #orders_page .orders_toolbar { align-items: stretch; flex-direction: column }
  #orders_page .orders_status_nav { width: 100% }
  #orders_page .orders_search { flex: auto; width: 100%; max-width: 560px }
  #orders_page .orders_table_wrap { overflow: visible }
  #orders_page .orders_table { display: block; width: 100%; min-width: 0; background: transparent }
  #orders_page .orders_table thead { display: none }
  #orders_page .orders_table tbody { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; width: 100% }
  #orders_page .orders_table tbody tr { display: block; min-width: 0; padding: 16px; border: 1px solid #e0eaf4; border-radius: 13px; background: #fff }
  #orders_page .orders_table tbody tr:hover { background: #fff }
  #orders_page .orders_table tbody td { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; width: 100%; max-width: none!important; padding: 9px 0; border-bottom: 0; text-align: right }
  #orders_page .orders_table tbody td:last-child { border-bottom: 0 }
  #orders_page .orders_table tbody td:before { content: attr(data-label); flex: 0 0 90px; color: #8598ae; font-size: 14px; font-weight: 600; line-height: 1.6; text-align: left }
  #orders_page .orders_link { justify-content: flex-end; max-width: calc(100% - 110px) }
  #orders_page .orders_link_url { white-space: normal; overflow-wrap: anywhere; text-align: right }
  #orders_page .orders_service { max-width: calc(100% - 110px); text-align: right }
  #orders_page .orders_status { justify-content: flex-end; white-space: normal; text-align: right }
  #orders_page .order-actions { justify-content: flex-end }
}
@media(max-width:767px) {
  #orders_page { padding: 45px 0 60px }
  #orders_page .orders_head { margin-bottom: 28px }
  #orders_page .orders_title { font-size: 32px }
  #orders_page .orders_desc { font-size: 13px }
  #orders_page .orders_status_nav { display: grid; grid-template-columns: repeat(4,1fr); gap: 6px; width: 100% }
  #orders_page .orders_status_nav a { min-width: 0; padding: 0 6px; font-size: 13px; text-align: center }
  #orders_page .orders_search { width: 100%; max-width: none }
  #orders_page .orders_search_box { height: 46px; border-radius: 9px }
  #orders_page .orders_search_box .form-control { height: 44px; padding: 0 15px; font-size: 12px }
  #orders_page .orders_search_box button { flex-basis: 54px; width: 54px; height: 46px; border-radius: 0 9px 9px 0 }
  #orders_page .orders_search_box button i { font-size: 15px }
  #orders_page .orders_panel { border-radius: 14px }
  #orders_page .orders_panel_head { align-items: flex-start; flex-direction: column; gap: 5px; margin-bottom: 20px }
  #orders_page .orders_table tbody { grid-template-columns: 1fr }
  #orders_page .order_detail_modal .modal-dialog { width: calc(100% - 24px); margin: 40px auto }
}
@media(max-width:500px) {
  #orders_page { padding: 35px 0 50px }
  #orders_page .orders_entitle { font-size: 9px }
  #orders_page .orders_title { font-size: 29px }
  #orders_page .orders_status_nav { grid-template-columns: repeat(2,1fr) }
  #orders_page .orders_table tbody tr { padding: 13px }
  #orders_page .orders_table tbody td { gap: 12px }
  #orders_page .orders_table tbody td:before { flex-basis: 78px }
  #orders_page .orders_link,#orders_page .orders_service { max-width: calc(100% - 90px) }
  #orders_page .order_detail_modal .modal-header,#orders_page .order_detail_modal .modal-body { padding: 18px }
}
#refunds_page { position: relative; width: 100%; min-height: 100vh; padding: 70px 0 100px; overflow: hidden; background: linear-gradient(145deg,#010c24 0%,#021a43 50%,#082b67 100%); color: #fff }
#refunds_page .refunds_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none }
#refunds_page .refunds_bg:before { content: ""; position: absolute; width: 760px; height: 760px; right: -340px; top: -360px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.15) 0%,rgba(20,156,255,.04) 45%,rgba(20,156,255,0) 72%) }
#refunds_page .refunds_bg:after { content: ""; position: absolute; width: 600px; height: 600px; left: -330px; bottom: -330px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.08) 0%,rgba(139,44,245,0) 70%) }
#refunds_page .refunds_head { margin-bottom: 38px }
#refunds_page .refunds_entitle { margin-bottom: 10px; color: #b5caff; font-family: 'Raleway',sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .35em }
#refunds_page .refunds_title { color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em }
#refunds_page .refunds_desc { color: #9fb3d1; font-size: 15px; line-height: 1.9 }
#refunds_page .refunds_alert { margin: 0 0 22px; padding: 14px 45px 14px 18px; border: 1px solid rgba(20,156,255,.18); border-radius: 10px; background: rgba(20,156,255,.07); color: #a8c9ee; font-size: 13px; box-shadow: none }
#refunds_page .refunds_alert .close { top: 0; color: #fff; opacity: .6; text-shadow: none }
#refunds_page .refunds_alert .close:hover { opacity: 1 }
#refunds_page .refunds_toolbar { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-bottom: 30px }
#refunds_page .refunds_status_nav { display: flex; align-items: center; flex-wrap: wrap; gap: 8px }
#refunds_page .refunds_status_nav a { display: flex; align-items: center; justify-content: center; min-height: 38px; padding: 0 15px; border: 1px solid rgba(107,166,239,.16); border-radius: 50px; background: rgba(255,255,255,.035); color: #9eb4cf; font-size: 14px; font-weight: 500; text-decoration: none; transition: .3s }
#refunds_page .refunds_status_nav a:hover { border-color: rgba(20,156,255,.55); background: rgba(20,156,255,.08); color: #fff }
#refunds_page .refunds_status_nav a.active { border-color: #149cff; background: #149cff; color: #fff; box-shadow: 0 8px 20px rgba(20,156,255,.18) }
#refunds_page .refunds_search { flex: 0 0 360px; width: 360px; margin: 0 }
#refunds_page .refunds_search_box { display: flex; align-items: stretch; width: 100%; height: 48px; border: 1px solid rgba(65,127,207,.46); border-radius: 10px; background: #071b43; overflow: hidden; transition: .3s }
#refunds_page .refunds_search_box:focus-within { border-color: #149cff; box-shadow: 0 0 0 3px rgba(20,156,255,.08) }
#refunds_page .refunds_search_box .form-control { flex: 1; min-width: 0; height: 46px; padding: 0 18px; border: 0; border-radius: 0; background: transparent!important; color: #fff; font-size: 15px; box-shadow: none!important; outline: none }
#refunds_page .refunds_search_box .form-control:focus { border: 0; background: transparent!important; box-shadow: none!important }
#refunds_page .refunds_search_box .form-control::placeholder { color: #7189aa; opacity: 1 }
#refunds_page .refunds_search_box button { display: flex; align-items: center; justify-content: center; flex: 0 0 58px; width: 58px; height: 48px; margin: -1px -1px -1px 0; padding: 0; border: 0; border-radius: 0 10px 10px 0; background: linear-gradient(135deg,#159fff 0%,#176edc 100%); color: #fff; cursor: pointer; transition: .3s }
#refunds_page .refunds_search_box button:hover { background: linear-gradient(135deg,#2aabff 0%,#0b5fca 100%) }
#refunds_page .refunds_search_box button i { font-size: 16px }
#refunds_page .refunds_panel { position: relative; border-radius: 18px; box-shadow: 0 25px 70px rgba(0,0,0,.15); overflow: hidden }
#refunds_page .refunds_table_wrap { width: 100%; overflow: visible }
#refunds_page .refunds_table { width: 100%; margin: 0; border-collapse: separate; border-spacing: 0; table-layout: fixed; background: transparent }
#refunds_page .refunds_table thead th { padding: 18px 16px; border: 0; border-bottom: 1px solid #dce7f2; background: var(--secondary); line-height: 1.5; white-space: nowrap; vertical-align: middle; color: #fff; font-size: 14px; font-weight: 700 }
#refunds_page .refunds_table thead th:first-child { padding-left: 22px }
#refunds_page .refunds_table thead th:last-child { padding-right: 22px }
#refunds_page .refunds_table tbody td { height: 62px; padding: 12px 18px; border: 0; border-bottom: 1px solid #e1e9f2; background: #fff; color: #405675; font-size: 14px; line-height: 1.7; vertical-align: middle }
#refunds_page .refunds_table tbody tr:last-child td { border-bottom: 0 }
#refunds_page .refunds_table tbody tr { transition: .25s }
#refunds_page .refunds_table tbody tr:hover td { background: #f5f9fd }
#refunds_page .refund_order_id { color: #149cff; font-family: 'Arimo',sans-serif; font-size: 14px; font-weight: 700; text-decoration: none }
#refunds_page .refund_order_id:hover { color: #0b6fca; text-decoration: none }
#refunds_page .refund_amount { color: #0b3f91; font-family: 'Arimo','Noto Sans TC',sans-serif; font-weight: 700 }
#refunds_page .refund_date { color: #7085a0; white-space: nowrap; font-size: 14px; font-family: 'Arimo' }
#refunds_page .refund_status { display: flex; align-items: center; gap: 8px; color: #435c79 }
#refunds_page .refund_status_dot { flex: 0 0 7px; width: 7px; height: 7px; border-radius: 50%; background: #149cff; box-shadow: 0 0 0 3px rgba(20,156,255,.12) }
#refunds_page .refunds_pagination { display: flex; justify-content: center; margin-top: 28px }
#refunds_page .pagination { margin: 0 }
#refunds_page .pagination>li>a,#refunds_page .pagination>li>span { min-width: 38px; height: 38px; margin: 0 3px; padding: 0 10px; border: 1px solid rgba(105,164,239,.2); border-radius: 8px; background: rgba(255,255,255,.05); color: #9cb5d4; line-height: 36px; text-align: center }
#refunds_page .pagination>li>a:hover { border-color: #149cff; background: #149cff; color: #fff }
#refunds_page .pagination>.active>a,#refunds_page .pagination>.active>a:hover { border-color: #149cff; background: #149cff; color: #fff }
body.refunds { background: #010c24 }
@media(max-width:1024px) {
  #refunds_page { padding: 60px 0 80px }
  #refunds_page .refunds_toolbar { align-items: stretch; flex-direction: column; gap: 18px }
  #refunds_page .refunds_search { flex: auto; width: 100%; max-width: 520px }
  #refunds_page { padding: 45px 0 60px }
  #refunds_page .refunds_head { margin-bottom: 28px }
  #refunds_page .refunds_title { font-size: 32px }
  #refunds_page .refunds_desc { font-size: 13px }
  #refunds_page .refunds_search { width: 100%; max-width: none }
  #refunds_page .refunds_search_box { height: 46px }
  #refunds_page .refunds_search_box .form-control { height: 44px }
  #refunds_page .refunds_search_box button { flex-basis: 54px; width: 54px; height: 46px }
  #refunds_page .refunds_panel { border-radius: 14px; background: transparent; box-shadow: none; overflow: visible }
  #refunds_page .refunds_panel:before { display: none }
  #refunds_page .refunds_table,#refunds_page .refunds_table tbody { display: block; width: 100% }
  #refunds_page .refunds_table thead { display: none }
  #refunds_page .refunds_table tbody { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; width: 100% }
  #refunds_page .refunds_table tbody tr { display: block; width: 100%; padding: 15px 17px; border: 1px solid #dfe9f3; border-radius: 12px; background: #fff }
  #refunds_page .refunds_table tbody tr:hover td { background: transparent }
  #refunds_page .refunds_table tbody td { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: 100%; height: auto; padding: 9px 0; border: 0; border-bottom: 1px solid #edf2f7; background: transparent; font-size: 14px; text-align: right }
  #refunds_page .refunds_table tbody td:last-child { border-bottom: 0 }
  #refunds_page .refunds_table tbody td:before { content: attr(data-label); flex: 0 0 95px; color: #8699b0; font-size: 13px; font-weight: 600; text-align: left }
  #refunds_page .refund_status { justify-content: flex-end; text-align: right }
}
@media(max-width:500px) {
  #refunds_page .refunds_table tbody { grid-template-columns: 1fr }
  #refunds_page { padding: 35px 0 50px }
  #refunds_page .refunds_entitle { font-size: 9px }
  #refunds_page .refunds_title { font-size: 29px }
  #refunds_page .refunds_status_nav { grid-template-columns: 1fr }
  #refunds_page .refunds_table tbody tr { padding: 13px 15px }
  #refunds_page .refunds_table tbody td:before { flex-basis: 82px }
}
#tickets_page { position: relative; width: 100%; min-height: 100vh; padding: 70px 0 100px; overflow: hidden; background: linear-gradient(145deg,#010c24 0%,#021a43 50%,#022764 100%); color: #fff }
#tickets_page .tickets_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none }
#tickets_page .tickets_bg:before { content: ""; position: absolute; width: 760px; height: 760px; right: -350px; top: -350px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.18) 0%,rgba(20,156,255,.04) 43%,rgba(20,156,255,0) 72%) }
#tickets_page .tickets_bg:after { content: ""; position: absolute; width: 620px; height: 620px; left: -320px; bottom: -320px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.1) 0%,rgba(139,44,245,0) 70%) }
#tickets_page .container { position: relative; z-index: 2 }
#tickets_page .tickets_head { margin-bottom: 36px }
#tickets_page .tickets_entitle { margin-bottom: 10px; color: #b5caff; font-family: 'Raleway',sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .35em }
#tickets_page .tickets_title { color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em }
#tickets_page .tickets_desc { margin-top: 6px; color: #9fb3d1; font-size: 15px; line-height: 1.9 }
#tickets_page .tickets_form_panel { position: relative; padding: 42px 46px; border-radius: 18px; background: #f8fbfe; box-shadow: 0 25px 70px rgba(0,0,0,.15); overflow: hidden; color: var(--info); font-size: 14px; font-weight: 500; line-height: 1.6 }
#tickets_page .tickets_form_panel:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg,#22c7f2 0%,#149cff 28%,#8b2cf5 62%,#f7256a 100%) }
#tickets_page .form-group { margin-bottom: 22px }
#tickets_page .control-label { display: block; margin-bottom: 9px; color: var(--info); font-size: 14px; font-weight: 500; line-height: 1.6 }
#tickets_page .form-control { width: 100%; height: 52px; padding: 10px 15px; border: 1px solid #cedbea; border-radius: 9px; background: #f8fbfe; color: #152540; font-size: 14px; box-shadow: none; outline: none; transition: .3s }
#tickets_page .form-control:hover { border-color: #9bbde0 }
#tickets_page .form-control:focus { border-color: #149cff; box-shadow: 0 0 0 3px rgba(20,156,255,.08) }
#tickets_page textarea.form-control { height: auto; min-height: 160px; padding: 14px 15px; resize: vertical; line-height: 1.8 }
#tickets_page .tickets_select_box { position: relative }
#tickets_page .tickets_select_box:after { content: ""; position: absolute; right: 18px; top: 50%; width: 7px; height: 7px; border-right: 2px solid #607a9e; border-bottom: 2px solid #607a9e; transform: translateY(-70%) rotate(45deg); pointer-events: none }
#tickets_page .tickets_select_box select { padding-right: 45px; cursor: pointer; appearance: none; -webkit-appearance: none; -moz-appearance: none }
#tickets_page #ticket-fields .form-group { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #e2ebf5 }
#tickets_page #ticket-fields .form-group:last-child { padding-bottom: 0; border-bottom: 0 }
#tickets_page .ticket-danger { margin-bottom: 22px; border: 0; border-radius: 10px }
#tickets_page .tickets_upload_group { margin-top: 5px }
#tickets_page .tickets-uploader { position: relative; min-height: 52px }
#tickets_page .tickets-uploader button,#tickets_page .tickets-uploader .btn { min-height: 42px; padding: 0 18px; border: 1px solid #cedbea; border-radius: 8px; background: #eef5fb; color: #416486; font-size: 12px; font-weight: 600; box-shadow: none; transition: .3s }
#tickets_page .tickets-uploader button:hover,#tickets_page .tickets-uploader .btn:hover { border-color: #149cff; background: #edf8ff; color: #149cff }
#tickets_page .tickets_submit { display: flex; align-items: center; justify-content: center; width: min(100%,300px); height: 52px; margin: 8px auto 0; padding: 0 24px; border: 0; border-radius: 50px; background: linear-gradient(90deg,#8b2cf5 0%,#149cff 100%); color: #fff; font-size: 15px; font-weight: 600; transition: .35s }
#tickets_page .tickets_submit:hover,#tickets_page .tickets_submit:focus { background: linear-gradient(90deg,#149cff,#0874df); color: #fff }
#tickets_page .tickets_toolbar { display: flex; align-items: flex-end; justify-content: flex-end; gap: 24px; margin: 38px 0 18px }
#tickets_page .tickets_history_title { color: #fff; font-size: 20px; font-weight: 700 }
#tickets_page .tickets_search { flex: 0 0 360px; width: 360px; margin: 0 }
#tickets_page .tickets_search_box { display: flex; align-items: stretch; width: 100%; height: 48px; border: 1px solid rgba(65,127,207,.42); border-radius: 10px; background: #071b43; overflow: hidden; transition: .3s }
#tickets_page .tickets_search_box:focus-within { border-color: #149cff; box-shadow: 0 0 0 3px rgba(20,156,255,.08) }
#tickets_page .tickets_search_box .form-control { flex: 1; min-width: 0; height: 46px; padding: 0 18px; border: 0; border-radius: 0; background: transparent!important; color: #fff; font-size: 15px; box-shadow: none!important }
#tickets_page .tickets_search_box .form-control:focus { border: 0; background: transparent!important; box-shadow: none!important }
#tickets_page .tickets_search_box .form-control::placeholder { color: #7189aa; opacity: 1 }
#tickets_page .tickets_search_box button { display: flex; align-items: center; justify-content: center; flex: 0 0 58px; width: 58px; height: 48px; margin: -1px -1px -1px 0; padding: 0; border: 0; border-radius: 0 10px 10px 0; background: linear-gradient(135deg,#159fff 0%,#176edc 100%); color: #fff; cursor: pointer; transition: .3s }
#tickets_page .tickets_search_box button:hover { background: linear-gradient(135deg,#2aabff 0%,#0b5fca 100%) }
#tickets_page .tickets_search_box button i { color: #fff; font-size: 16px }
#tickets_page .tickets_history_panel { position: relative; border-radius: 18px; box-shadow: 0 25px 70px rgba(0,0,0,.15); overflow: hidden }
#tickets_page .tickets_table_wrap { width: 100%; overflow: visible }
#tickets_page .tickets_table { width: 100%; margin: 0; border-collapse: separate; border-spacing: 0; table-layout: fixed; background: transparent }
#tickets_page .tickets_table thead th { padding: 18px 16px; border: 0; border-bottom: 1px solid #dce7f2; background: var(--secondary); line-height: 1.5; white-space: nowrap; vertical-align: middle; color: #fff; font-size: 14px; font-weight: 700 }
#tickets_page .tickets_table thead th:nth-child(1) { width: 14% }
#tickets_page .tickets_table thead th:nth-child(2) { width: 46% }
#tickets_page .tickets_table thead th:nth-child(3) { width: 18% }
#tickets_page .tickets_table thead th:nth-child(4) { width: 22% }
#tickets_page .tickets_table tbody td { height: 62px; padding: 12px 20px; border: 0; border-bottom: 1px solid #e1e9f2; background: #fff; color: #405675; font-size: 14px; line-height: 1.7; vertical-align: middle }
#tickets_page .tickets_table tbody tr:last-child td { border-bottom: 0 }
#tickets_page .tickets_table tbody tr:hover td { background: #f5f9fd }
#tickets_page .ticket_id { color: #149cff; font-family: 'Arimo',sans-serif; font-weight: 700 }
#tickets_page .ticket_subject { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; color: #304d70; font-weight: 500; text-decoration: none }
#tickets_page .ticket_subject:hover { color: #149cff }
#tickets_page .ticket_subject.is_new { font-weight: 700 }
#tickets_page .ticket_subject i { display: inline-flex; align-items: center; justify-content: center; height: 18px; padding: 0 6px; border-radius: 50px; background: rgba(247,37,106,.09); color: #f7256a; font-family: 'Raleway',sans-serif; font-size: 7px; font-style: normal; font-weight: 700; letter-spacing: .08em }
#tickets_page .ticket_status { display: flex; align-items: center; gap: 8px }
#tickets_page .ticket_status_dot { flex: 0 0 7px; width: 7px; height: 7px; border-radius: 50%; background: #149cff; box-shadow: 0 0 0 3px rgba(20,156,255,.12) }
#tickets_page .ticket_time { color: #7085a0; white-space: nowrap; font-family: 'Arimo' }
#tickets_page .tickets_pagination { display: flex; justify-content: center; margin-top: 28px }
#tickets_page .pagination { margin: 0 }
#tickets_page .pagination>li>a,#tickets_page .pagination>li>span { min-width: 38px; height: 38px; margin: 0 3px; padding: 0 10px; border: 1px solid rgba(105,164,239,.2); border-radius: 8px; background: rgba(255,255,255,.05); color: #9cb5d4; line-height: 36px; text-align: center }
#tickets_page .pagination>li>a:hover { border-color: #149cff; background: #149cff; color: #fff }
#tickets_page .pagination>.active>a,#tickets_page .pagination>.active>a:hover { border-color: #149cff; background: linear-gradient(90deg,#8b2cf5,#149cff); color: #fff }
#tickets_page .tickets_info { position: relative; margin-top: 28px; padding: 28px 30px; border: 1px solid rgba(87,157,246,.17); border-radius: 18px; background: linear-gradient(145deg,rgba(5,31,72,.97),rgba(2,20,49,.98)); box-shadow: 0 25px 60px rgba(0,0,0,.2); overflow: hidden }
#tickets_page .tickets_info_head { display: flex; align-items: center; gap: 13px; margin-bottom: 20px }
#tickets_page .tickets_info_icon { display: flex; align-items: center; justify-content: center; flex: 0 0 40px; width: 40px; height: 40px; border: 1px solid rgba(20,156,255,.25); border-radius: 50%; background: rgba(20,156,255,.08); color: #63c9ff; font-size: 14px }
#tickets_page .tickets_info_title { color: #fff; font-size: 18px; font-weight: 700 }
#tickets_page .tickets_info_content { color: #aebed5; font-size: 13px; line-height: 2 }
#tickets_page .tickets_info_content p { margin: 0 0 12px }
#tickets_page .tickets_info_content p:last-child { margin-bottom: 0 }
#tickets_page .tickets_info_content a { color: #55b9ff }
#tickets_page .tickets_info_content img { max-width: 100%; height: auto }
body.tickets { background: #010c24 }
@media(max-width:1024px) {
  #tickets_page { padding: 60px 0 80px }
  #tickets_page .tickets_form_panel { padding: 38px; border-radius: 14px }
  #tickets_page .tickets_search { flex: auto; width: 100%; max-width: 520px }
  #tickets_page { padding: 45px 0 60px }
  #tickets_page .tickets_head { margin-bottom: 28px }
  #tickets_page .tickets_title { font-size: 32px }
  #tickets_page .tickets_desc { font-size: 13px }
  #tickets_page .form-control { height: 50px }
  #tickets_page textarea.form-control { min-height: 140px }
  #tickets_page .tickets_submit { height: 50px }
  #tickets_page .tickets_toolbar { margin-top: 30px; margin-bottom: 30px }
  #tickets_page .tickets_search_box { height: 46px }
  #tickets_page .tickets_search_box .form-control { height: 44px; padding: 0 15px }
  #tickets_page .tickets_search_box button { flex-basis: 54px; width: 54px; height: 46px }
  #tickets_page .tickets_history_panel { border-radius: 0; background: transparent; box-shadow: none; overflow: visible }
  #tickets_page .tickets_history_panel:before { display: none }
  #tickets_page .tickets_table,#tickets_page .tickets_table tbody { display: block; width: 100% }
  #tickets_page .tickets_table thead { display: none }
  #tickets_page .tickets_table tbody { display: grid; grid-template-columns: 1fr 1fr; gap: 12px }
  #tickets_page .tickets_table tbody tr { display: block; width: 100%; padding: 15px 17px; border: 1px solid #dfe9f3; border-radius: 12px; background: #fff }
  #tickets_page .tickets_table tbody tr:hover td { background: transparent }
  #tickets_page .tickets_table tbody td { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: 100%; height: auto; padding: 9px 0; border: 0; border-bottom: 0; background: transparent; text-align: right }
  #tickets_page .tickets_table tbody td:last-child { border-bottom: 0 }
  #tickets_page .tickets_table tbody td:before { content: attr(data-label); flex: 0 0 90px; color: #8699b0; font-size: 13px; font-weight: 600; text-align: left }
  #tickets_page .ticket_subject { justify-content: flex-end; max-width: calc(100% - 105px); text-align: right }
  #tickets_page .ticket_status { justify-content: flex-end }
  #tickets_page .tickets_info { padding: 24px 20px; border-radius: 14px }
}
@media(max-width:500px) {
  #tickets_page .tickets_table tbody { grid-template-columns: 1fr }
  #tickets_page .tickets_search { width: 100%; max-width: none }
  #tickets_page { padding: 35px 0 50px }
  #tickets_page .tickets_entitle { font-size: 9px }
  #tickets_page .tickets_title { font-size: 29px }
  #tickets_page .tickets_form_panel { padding: 24px }
  #tickets_page .tickets_panel_title { font-size: 18px }
  #tickets_page .tickets_history_title { font-size: 18px }
  #tickets_page .tickets_table tbody tr { padding: 13px 15px }
  #tickets_page .tickets_table tbody td:before { flex-basis: 78px }
  #tickets_page .ticket_subject { max-width: calc(100% - 92px) }
  #tickets_page .tickets_info { padding: 21px 16px }
}
#viewticket_page { position: relative; width: 100%; min-height: 100vh; padding: 70px 0 100px; overflow: hidden; background: linear-gradient(145deg,#010c24 0%,#021a43 50%,#022764 100%); }
#viewticket_page .viewticket_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none; }
#viewticket_page .viewticket_bg:before { content: ""; position: absolute; width: 760px; height: 760px; right: -350px; top: -350px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.18) 0%,rgba(20,156,255,.04) 43%,rgba(20,156,255,0) 72%); }
#viewticket_page .viewticket_bg:after { content: ""; position: absolute; width: 620px; height: 620px; left: -320px; bottom: -320px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.1) 0%,rgba(139,44,245,0) 70%); }
#viewticket_page .container { position: relative; z-index: 2; }
#viewticket_page .viewticket_head { margin-bottom: 36px; }
#viewticket_page .viewticket_entitle { margin-bottom: 10px; color: #b5caff; font-family: 'Raleway',sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .35em; }
#viewticket_page .viewticket_title { color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em; }
#viewticket_page .viewticket_desc { margin-top: 6px; color: #9fb3d1; font-size: 15px; line-height: 1.9; }
#viewticket_page .viewticket_panel { position: relative; border-radius: 18px; background: #f8fbfe; box-shadow: 0 25px 70px rgba(0,0,0,.18); overflow: hidden; }
#viewticket_page .viewticket_panel:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg,#22c7f2 0%,#149cff 28%,#8b2cf5 62%,#f7256a 100%); z-index: 2; }
#viewticket_page .viewticket_panel_head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 30px 36px; border-bottom: 1px solid #e1eaf3; background: #fff; }
#viewticket_page .viewticket_panel_entitle { margin-bottom: 4px; color: #7894b5; font-family: 'Raleway',sans-serif; font-size: 8px; font-weight: 700; letter-spacing: .22em; }
#viewticket_page .viewticket_subject { color: #152540; font-size: 20px; font-weight: 700; line-height: 1.5; }
#viewticket_page .viewticket_status { display: flex; align-items: center; gap: 8px; color: #758da8; font-family: 'Raleway',sans-serif; font-size: 9px; font-weight: 700; letter-spacing: .14em; }
#viewticket_page .viewticket_status span { width: 7px; height: 7px; border-radius: 50%; background: #22c7f2; box-shadow: 0 0 0 4px rgba(34,199,242,.1); }
#viewticket_page .viewticket_messages { padding: 36px; background: #f4f8fc; }
#viewticket_page .ticket_chat { display: flex; width: 100%; margin-bottom: 28px; }
#viewticket_page .ticket_chat:last-child { margin-bottom: 0; }
#viewticket_page .ticket_chat_inner { width: 100%; max-width: 72%; }
#viewticket_page .ticket_chat_support { justify-content: flex-start; }
#viewticket_page .ticket_chat_user { justify-content: flex-end; }
#viewticket_page .ticket_chat_label { margin-bottom: 6px; color: #8ca1b9; font-family: 'Raleway',sans-serif; font-size: 8px; font-weight: 700; letter-spacing: .16em; }
#viewticket_page .ticket_chat_user .ticket_chat_label { text-align: right; }
#viewticket_page .ticket_bubble { position: relative; padding: 18px 20px; border-radius: 14px; font-size: 13px; line-height: 1.9; word-break: break-word; overflow-wrap: anywhere; }
#viewticket_page .ticket_chat_support .ticket_bubble { border: 1px solid #d9e5f1; border-radius: 4px 14px 14px 14px; background: #fff; color: #425a76; box-shadow: 0 8px 22px rgba(2,39,100,.05); }
#viewticket_page .ticket_chat_user .ticket_bubble { border-radius: 14px 4px 14px 14px; background: linear-gradient(135deg,var(--gray) 0%,var(--graylight) 100%); color: #fff; box-shadow: 0 10px 24px rgba(20,100,220,.16); }
#viewticket_page .ticket_message_content { width: 100%; }
#viewticket_page .ticket_message_content p { margin: 0 0 10px; }
#viewticket_page .ticket_message_content p:last-child { margin-bottom: 0; }
#viewticket_page .ticket_message_content a { color: #149cff; word-break: break-all; }
#viewticket_page .ticket_chat_user .ticket_message_content a { color: #fff; text-decoration: underline; }
#viewticket_page .ticket_chat_info { display: flex; align-items: center; gap: 8px; margin-top: 7px; color: #8a9db3; font-size: 10px; }
#viewticket_page .ticket_chat_user .ticket_chat_info { justify-content: flex-end; text-align: right; }
#viewticket_page .ticket_chat_info strong { color: #627993; font-size: 13px; font-weight: 600; }
#viewticket_page .ticket_chat_info span { color: #9aaabd; font-size: 13px; font-family: 'Arimo'; }
#viewticket_page .ticket_files { display: grid; gap: 8px; margin-top: 14px; padding-top: 13px; border-top: 1px solid rgba(128,158,192,.18); }
#viewticket_page .ticket_chat_user .ticket_files { border-top-color: rgba(255,255,255,.18); }
#viewticket_page .ticket_file { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 9px 11px; border-radius: 8px; background: #f1f6fb; color: #416486; font-size: 11px; text-decoration: none; transition: .3s; }
#viewticket_page .ticket_chat_user .ticket_file { background: rgba(255,255,255,.1); color: #fff; }
#viewticket_page .ticket_file:hover { background: #e5f2fc; color: #149cff; }
#viewticket_page .ticket_chat_user .ticket_file:hover { background: rgba(255,255,255,.17); color: #fff; }
#viewticket_page .ticket_file_icon { display: flex; align-items: center; justify-content: center; flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%; background: #fff; color: #149cff; font-size: 11px; }
#viewticket_page .ticket_file>span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#viewticket_page .viewticket_reply { padding: 34px 36px 38px; border-top: 1px solid #e0e9f3; background: #fff; }
#viewticket_page .viewticket_reply_head { margin-bottom: 24px; }
#viewticket_page .viewticket_reply_title { color: #152540; font-size: 19px; font-weight: 700; }
#viewticket_page .form-group { margin-bottom: 22px; }
#viewticket_page .control-label { display: block; margin-bottom: 9px; color: #405675; font-size: 13px; font-weight: 600; line-height: 1.6; }
#viewticket_page .form-control { width: 100%; height: 52px; padding: 10px 15px; border: 1px solid #cedbea; border-radius: 9px; background: #ffffff; color: #152540; font-size: 14px; box-shadow: none; outline: none; transition: .3s; }
#viewticket_page .form-control:hover { border-color: #9bbde0; }
#viewticket_page .form-control:focus { border-color: #149cff; box-shadow: 0 0 0 3px rgba(20,156,255,.08); }
#viewticket_page textarea.form-control { height: auto; min-height: 150px; padding: 14px 15px; line-height: 1.8; resize: vertical; }
#viewticket_page .viewticket_alert { margin-bottom: 22px; border: 0; border-radius: 10px; }
#viewticket_page .viewticket_upload { margin-bottom: 24px; }
#viewticket_page .tickets-uploader { position: relative; min-height: 44px; }
#viewticket_page .tickets-uploader button,#viewticket_page .tickets-uploader .btn { min-height: 42px; padding: 0 18px; border: 1px solid #cedbea; border-radius: 8px; background: #eef5fb; color: #416486; font-size: 12px; font-weight: 600; box-shadow: none; transition: .3s; }
#viewticket_page .tickets-uploader button:hover,#viewticket_page .tickets-uploader .btn:hover { border-color: #149cff; background: #edf8ff; color: #149cff; }
#viewticket_page .viewticket_submit { display: flex; align-items: center; justify-content: center; width: min(100%,300px); height: 52px; padding: 0 24px; border: 0; border-radius: 50px; background: linear-gradient(90deg,#8b2cf5 0%,#149cff 100%); color: #fff; font-size: 15px; font-weight: 600; transition: .35s; margin: 0 auto; }
#viewticket_page .viewticket_submit:hover,#viewticket_page .viewticket_submit:focus { background: linear-gradient(90deg,#149cff,#0874df); color: #fff; }
body.viewticket { background: #010c24; }
@media(max-width:1024px) {
  #viewticket_page { padding: 60px 0 80px; }
  #viewticket_page .ticket_chat_inner { max-width: 80%; }
}
@media(max-width:767px) {
  #viewticket_page { padding: 45px 0 60px; }
  #viewticket_page .viewticket_head { margin-bottom: 28px; }
  #viewticket_page .viewticket_title { font-size: 32px; }
  #viewticket_page .viewticket_desc { font-size: 13px; }
  #viewticket_page .viewticket_panel { border-radius: 14px; }
  #viewticket_page .viewticket_panel_head { align-items: flex-start; flex-direction: column; padding: 24px 20px; }
  #viewticket_page .viewticket_subject { font-size: 18px; }
  #viewticket_page .viewticket_messages { padding: 26px 20px; }
  #viewticket_page .ticket_chat_inner { max-width: 88%; }
  #viewticket_page .ticket_bubble { padding: 15px 16px; font-size: 14px; }
  #viewticket_page .viewticket_reply { padding: 26px 20px 30px; }
  #viewticket_page textarea.form-control { min-height: 130px; }
  #viewticket_page .viewticket_submit { height: 50px; }
}
@media(max-width:500px) {
  #viewticket_page { padding: 35px 0 50px; }
  #viewticket_page .viewticket_entitle { font-size: 9px; }
  #viewticket_page .viewticket_title { font-size: 29px; }
  #viewticket_page .viewticket_panel_head { padding: 22px 16px; }
  #viewticket_page .viewticket_messages { padding: 22px 14px; }
  #viewticket_page .ticket_chat { margin-bottom: 22px; }
  #viewticket_page .ticket_chat_inner { max-width: 94%; }
  #viewticket_page .ticket_bubble { padding: 14px; }
  #viewticket_page .ticket_chat_info { align-items: flex-start; flex-direction: column; gap: 1px; }
  #viewticket_page .ticket_chat_user .ticket_chat_info { align-items: flex-end; }
  #viewticket_page .viewticket_reply { padding: 24px 16px 26px; }
}
#account_page { position: relative; width: 100%; min-height: 100vh; padding: 70px 0 100px; overflow: hidden; background: linear-gradient(145deg,#010c24 0%,#021a43 50%,#022764 100%); color: #fff; }
#account_page .account_bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none; }
#account_page .account_bg:before { content: ""; position: absolute; width: 760px; height: 760px; right: -350px; top: -350px; border-radius: 50%; background: radial-gradient(circle,rgba(20,156,255,.18) 0%,rgba(20,156,255,.04) 43%,rgba(20,156,255,0) 72%); }
#account_page .account_bg:after { content: ""; position: absolute; width: 620px; height: 620px; left: -320px; bottom: -320px; border-radius: 50%; background: radial-gradient(circle,rgba(139,44,245,.1) 0%,rgba(139,44,245,0) 70%); }
#account_page .container { position: relative; z-index: 2; }
#account_page .account_head { margin-bottom: 30px; }
#account_page .account_entitle { margin-bottom: 10px; color: #b5caff; font-family: 'Raleway',sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .35em; }
#account_page .account_title { color: #fff; font-size: clamp(28px,2.2vw,40px); font-weight: 600; line-height: 1.28; letter-spacing: -.02em; }
#account_page .account_desc { margin-top: 6px; color: #9fb3d1; font-size: 15px; line-height: 1.9; }
#account_page .account_tabs { display: flex; align-items: center; gap: 8px; margin-bottom: 24px; }
#account_page .account_tabs a { display: flex; align-items: center; justify-content: center; min-width: 90px; height: 40px; padding: 0 23px; border: 1px solid rgba(107,166,239,.2); border-radius: 50px; background: rgba(255,255,255,.03); color: #9eb9da; font-size: 14px; font-weight: 500; text-decoration: none; transition: .3s; }
#account_page .account_tabs a:hover { border-color: #149cff; background: rgba(20,156,255,.08); color: #fff; }
#account_page .account_tabs a.active { border-color: #149cff; background: #149cff; color: #fff; box-shadow: 0 8px 20px rgba(20,99,214,.16); }
#account_page .account_alert { margin-bottom: 20px; border: 0; border-radius: 10px; }
#account_page .account_alert .close {top: 2px;}
#account_page .account_inner_alert { margin-bottom: 20px; border: 0; border-radius: 9px; }
#account_page .account_inner_alert .close { top: 3px; }
#account_page .account_profile_card,#account_page .account_card { position: relative; border-radius: 18px; background: #f8fbfe; box-shadow: 0 25px 70px rgba(0,0,0,.15); overflow: hidden; }
#account_page .account_profile_card:before,#account_page .account_card:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg,#22c7f2 0%,#149cff 28%,#8b2cf5 62%,#f7256a 100%); }
#account_page .account_profile_card { margin-bottom: 22px; padding: 34px 38px; }
#account_page .account_grid { display: grid; grid-template-columns: 1fr; gap: 22px; }
#account_page .account_card { padding: 32px 34px; }
#account_page .account_api_card { grid-column: 1/-1; }
#account_page .account_card_head { display: flex; align-items: center; gap: 14px; margin-bottom: 27px; }
#account_page .account_card_icon { display: flex; align-items: center; justify-content: center; flex: 0 0 44px; width: 44px; height: 44px; border: 1px solid rgba(20,156,255,.15); border-radius: 12px; background: linear-gradient(135deg,rgba(20,156,255,.1),rgba(139,44,245,.07)); color: #149cff; font-size: 16px; }
#account_page .account_card_en { margin-bottom: 3px; color: #7894b5; font-family: 'Raleway',sans-serif; font-size: 8px; font-weight: 700; letter-spacing: .2em; display: none; }
#account_page .account_card_title { color: #152540; font-size: 19px; font-weight: 700; line-height: 1.4; }
#account_page .account_card_desc { margin-top: 3px; color: #899bb1; font-size: 13px; line-height: 1.6; }
#account_page .account_profile_grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
#account_page .form-group { margin-bottom: 20px; }
#account_page .form-group:last-child { margin-bottom: 0; }
#account_page .control-label,.account_modal label { display: block; margin-bottom: 8px; color: #405675; font-size: 14px; font-weight: 600; line-height: 1.6; }
#account_page .form-control,.account_modal .form-control { width: 100%; height: 50px; padding: 9px 14px; border: 1px solid #cedbea; border-radius: 9px; background: #fff; color: #152540; font-size: 13px; box-shadow: none; outline: none; transition: .3s; }
#account_page .form-control:hover,.account_modal .form-control:hover { border-color: #9bbde0; }
#account_page .form-control:focus,.account_modal .form-control:focus { border-color: #149cff; background: #fff; box-shadow: 0 0 0 3px rgba(20,156,255,.08); }
#account_page .form-control[readonly] { background: #f0f4f8; color: #60748d; }
#account_page .account_card_action { display: flex; justify-content: flex-end; margin-top: 4px; }
#account_page .account_btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 150px; height: 46px; padding: 0 20px; border: 0; border-radius: 50px; font-size: 14px; font-weight: 500; text-decoration: none; box-shadow: none; transition: .3s; }
#account_page .account_btn.primary { background: linear-gradient(90deg,#8b2cf5 0%,#149cff 100%); color: #fff; }
#account_page .account_btn.primary:hover { background: linear-gradient(90deg,#149cff 0%,#149cff 100%); color: #fff; }
#account_page .account_btn.secondary { border: 1px solid #cbdbea; background: #fff; color: #416486; }
#account_page .account_btn.secondary:hover { border-color: #149cff; background: #edf8ff; color: #149cff; }
#account_page .account_info_box { margin-bottom: 20px; padding: 14px 16px; border: 1px solid #dce8f3; border-radius: 9px; background: #eef5fb; color: #627992; font-size: 14px; line-height: 1.8; }
#account_page .account_2fa_status { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; padding: 14px 16px; border: 1px solid #dce8f3; border-radius: 10px; background: #fff; }
#account_page .account_2fa_status >div{display:flex;align-items: center;gap: 10px;}
#account_page .account_2fa_label { color: #263e5c; font-size: 15px; font-weight: 600; }
#account_page .account_2fa_text {color: white;font-size: 13px;background: #f72558;padding: 2px 10px;border-radius: 23px;}
#account_page .account_status_dot { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: #edf1f5; }
#account_page .account_status_dot span { width: 8px; height: 8px; border-radius: 50%; background: #9eafbf; }
#account_page .account_status_dot.active { background: rgba(20,156,255,.1); }
#account_page .account_status_dot.active span { background: #149cff; box-shadow: 0 0 0 4px rgba(20,156,255,.12); }
#account_page .account_select_box { position: relative; }
#account_page .account_select_box:after { content: ""; position: absolute; right: 17px; top: 50%; width: 7px; height: 7px; border-right: 2px solid #657e9d; border-bottom: 2px solid #657e9d; transform: translateY(-70%) rotate(45deg); pointer-events: none; }
#account_page .account_select_box select { padding-right: 45px; cursor: pointer; appearance: none; -webkit-appearance: none; -moz-appearance: none; }
#account_page .account_help { margin-top: 7px; color: #8497ad; font-size: 10px; line-height: 1.6; }
#account_page .account_api_field { position: relative; }
body.account { background: #010c24; }
/* Email Modal */
.account_modal .modal-dialog { width: 92%; max-width: 560px; margin: 80px auto; }
.account_modal .modal-content { overflow: hidden; border: 1px solid rgba(105,164,239,.2); border-radius: 16px; background: #fff; box-shadow: 0 30px 80px rgba(0,0,0,.38); }
.account_modal .modal-header { display: flex; align-items: center; justify-content: space-between; padding: 22px 24px; border-bottom: 1px solid #e2eaf3; }
.account_modal .account_modal_en { margin-bottom: 3px; color: #7894b5; font-family: 'Raleway',sans-serif; font-size: 8px; font-weight: 700; letter-spacing: .2em; }
.account_modal .modal-title { margin: 0; color: #152540; font-size: 19px; font-weight: 700; }
.account_modal .close { margin: 0; color: #526981; font-size: 27px; font-weight: 300; opacity: .65; text-shadow: none; }
.account_modal .close:hover { opacity: 1; }
.account_modal .modal-body { padding: 24px; }
.account_modal .form-group { margin-bottom: 20px; }
.account_modal .account_current_email { display: flex; align-items: center; background: #f0f4f8; color: #60748d; }
.account_modal .modal-footer { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 18px 24px; border-top: 1px solid #e2eaf3; }
.account_modal .account_modal_btn { display: inline-flex; align-items: center; justify-content: center; min-width: 110px; height: 42px; padding: 0 18px; border-radius: 50px; font-size: 12px; font-weight: 600; transition: .3s; }
.account_modal .account_modal_btn.cancel { border: 1px solid #d0dce8; background: #fff; color: #61758e; }
.account_modal .account_modal_btn.cancel:hover { border-color: #9fb3c9; background: #f4f7fa; }
.account_modal .account_modal_btn.submit { border: 0; background: linear-gradient(90deg,#8b2cf5,#149cff); color: #fff; }
.account_modal .account_modal_btn.submit:hover { background: linear-gradient(90deg,#149cff,#0874df); }
/* RWD */
@media(max-width:1024px) {
  #account_page { padding: 60px 0 80px; }
  #account_page .account_profile_card { padding: 30px; }
  #account_page .account_card { padding: 28px; }
}
@media(max-width:767px) {
  #account_page { padding: 45px 0 60px; }
  #account_page .account_head { margin-bottom: 26px; }
  #account_page .account_title { font-size: 32px; }
  #account_page .account_desc { font-size: 13px; }
  #account_page .account_tabs { width: 100%; }
  #account_page .account_tabs a { flex: 1; min-width: 0; }
  #account_page .account_profile_card { padding: 26px 20px; border-radius: 14px; }
  #account_page .account_grid { grid-template-columns: 1fr; gap: 16px; }
  #account_page .account_api_card { grid-column: auto; }
  #account_page .account_card { padding: 26px 20px; border-radius: 14px; }
  #account_page .account_profile_grid {grid-template-columns: 1fr;gap: 0;margin-bottom: 20px;}
  #account_page .account_card_action { justify-content: stretch; }
  #account_page .account_btn { width: 100%; }
  .account_modal .modal-dialog { width: calc(100% - 24px); margin: 40px auto; }
}
@media(max-width:500px) {
  #account_page { padding: 35px 0 50px; }
  #account_page .account_entitle { font-size: 9px; }
  #account_page .account_title { font-size: 29px; }
  #account_page .account_profile_card,#account_page .account_card { padding: 23px 16px; }
  #account_page .account_card_head { align-items: flex-start; gap: 11px; }
  #account_page .account_card_icon { flex-basis: 40px; width: 40px; height: 40px; }
  #account_page .account_card_title { font-size: 17px; }
  .account_modal .modal-header,.account_modal .modal-body,.account_modal .modal-footer { padding-left: 18px; padding-right: 18px; }
  .account_modal .modal-footer { flex-direction: column; }
  .account_modal .account_modal_btn { width: 100%; }
}
#notifications_page{position:relative;width:100%;min-height:100vh;padding:70px 0 100px;overflow:hidden;background:linear-gradient(145deg,#010c24 0%,#021a43 50%,#022764 100%);color:#fff;}
#notifications_page .notifications_bg{position:absolute;left:0;top:0;width:100%;height:100%;overflow:hidden;pointer-events:none;}
#notifications_page .notifications_bg:before{content:"";position:absolute;width:760px;height:760px;right:-350px;top:-350px;border-radius:50%;background:radial-gradient(circle,rgba(20,156,255,.18) 0%,rgba(20,156,255,.04) 43%,rgba(20,156,255,0) 72%);}
#notifications_page .notifications_bg:after{content:"";position:absolute;width:620px;height:620px;left:-320px;bottom:-320px;border-radius:50%;background:radial-gradient(circle,rgba(139,44,245,.1) 0%,rgba(139,44,245,0) 70%);}
#notifications_page .container{position:relative;z-index:2;}
#notifications_page .notifications_head{margin-bottom:30px;}
#notifications_page .notifications_entitle{margin-bottom:10px;color:#b5caff;font-family:'Raleway',sans-serif;font-size:12px;font-weight:600;letter-spacing:.35em;}
#notifications_page .notifications_title{color:#fff;font-size:clamp(28px,2.2vw,40px);font-weight:600;line-height:1.28;letter-spacing:-.02em;}
#notifications_page .notifications_desc{margin-top:6px;color:#9fb3d1;font-size:15px;line-height:1.9;}

/* Tabs */
#notifications_page .notifications_tabs{display:flex;align-items:center;gap:8px;margin-bottom:24px;}
#notifications_page .notifications_tabs a{display:flex;align-items:center;justify-content:center;min-width:90px;height:40px;padding:0 18px;border:1px solid rgba(107,166,239,.2);border-radius:50px;background:rgba(255,255,255,.03);color:#9eb9da;font-size:12px;font-weight:500;text-decoration:none;transition:.3s;}
#notifications_page .notifications_tabs a:hover{border-color:#149cff;background:rgba(20,156,255,.08);color:#fff;}
#notifications_page .notifications_tabs a.active{border-color:#149cff;background: #149cff;color:#fff;box-shadow:0 8px 20px rgba(20,99,214,.16);}

/* 上方功能卡 */
#notifications_page .notifications_top_grid{display:grid;gap:22px;margin-bottom:22px;}
#notifications_page .notifications_card,
#notifications_page .notifications_setting_card{position:relative;border-radius:18px;background:#f8fbfe;box-shadow:0 25px 70px rgba(0,0,0,.15);overflow:hidden;}
#notifications_page .notifications_card:before,
#notifications_page .notifications_setting_card:before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg,#22c7f2 0%,#149cff 28%,#8b2cf5 62%,#f7256a 100%);}
#notifications_page .notifications_card{display:flex;flex-direction:column;padding:32px 34px;}
#notifications_page .notifications_card_head{display:flex;align-items:center;gap:14px;margin-bottom:24px;}
#notifications_page .notifications_card_icon{display:flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;border:1px solid rgba(20,156,255,.16);border-radius:12px;background:linear-gradient(135deg,rgba(20,156,255,.1),rgba(139,44,245,.07));color:#149cff;font-size:16px;}
#notifications_page .notifications_card_icon.telegram{color:#229ed9;}
#notifications_page .notifications_card_en{margin-bottom:3px;color:#7894b5;font-family:'Raleway',sans-serif;font-size:8px;font-weight:700;letter-spacing:.2em;display: none;}
#notifications_page .notifications_card_title{color:#152540;font-size:19px;font-weight:700;line-height:1.4;}
#notifications_page .notifications_card_desc{margin-top:3px;color:#899bb1;font-size: 13px;line-height:1.6;}
#notifications_page .notifications_info_box{flex:1;margin-bottom:20px;padding:14px 16px;border:1px solid #dce8f3;border-radius:9px;background:#eef5fb;color:#627992;font-size: 14px;line-height:1.8;}
#notifications_page .notifications_inner_alert{margin-bottom:18px;border:0;border-radius:9px;}
#notifications_page .notifications_inner_alert .close{top:3px;}

/* 按鈕 */
#notifications_page .notifications_btn{display:flex;align-items:center;justify-content:center;gap:8px;width: min(100%, 300px);height:46px;padding:0 20px;border:0;border-radius:50px;font-size: 14px;font-weight:600;box-shadow:none;transition:.3s;margin: 0 auto;}
#notifications_page .notifications_btn.primary{background:linear-gradient(90deg,#8b2cf5 0%,#149cff 100%);color:#fff;}
#notifications_page .notifications_btn.primary:hover{background:linear-gradient(90deg,#149cff,#0874df);color:#fff;}
#notifications_page .notifications_btn.telegram_btn{background:#229ed9;color:#fff;box-shadow:0 10px 24px rgba(34,158,217,.18);}
#notifications_page .notifications_btn.telegram_btn:hover{background:#168bc2;color:#fff;}

/* 通知設定 */
#notifications_page .notifications_setting_card{padding:34px;}
#notifications_page .notifications_setting_head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:26px;}
#notifications_page .notifications_setting_title{color:#152540;font-size:20px;font-weight:700;}
#notifications_page .notifications_setting_desc{margin-top:4px;color:#899bb1;font-size: 14px;}
#notifications_page .notifications_setting_status{display:flex;align-items:center;gap:7px;color:#8195ad;font-size:11px;}
#notifications_page .notifications_setting_status span{width:7px;height:7px;border-radius:50%;background:#22c7f2;box-shadow:0 0 0 4px rgba(34,199,242,.1);}

/* 表格 */
#notifications_page .notifications_table_wrap{width:100%;overflow:visible;}
#notifications_page .notifications_table{width:100%;margin:0;border-collapse:separate;border-spacing:0;table-layout:auto;}
#notifications_page .notifications_table thead th{height:54px;padding:0 18px;border:0;background:#174798;color:#fff;font-size: 14px;font-weight:600;text-align:center;vertical-align:middle;}
#notifications_page .notifications_table thead th:first-child{text-align:left;border-radius:10px 0 0 10px;}
#notifications_page .notifications_table thead th:last-child{border-radius:0 10px 10px 0;}
#notifications_page .notifications_table tbody td{height:62px;padding:12px 18px;border:0;border-bottom:1px solid #e3ebf3;background:#fff;color:#405675;font-size: 14px;vertical-align:middle;}
#notifications_page .notifications_table tbody tr:last-child td{border-bottom:0;}
#notifications_page .notifications_table tbody tr{transition:.25s;}
#notifications_page .notifications_table tbody tr:hover td{background:#f5f9fd;}
#notifications_page .notifications_table .notification_name{color:#304866;font-weight:600;}
#notifications_page .notification_toggle_cell{text-align:center;}

/* Switch */
#notifications_page .notification_toggle_wrap{display:inline-flex;align-items:center;justify-content:center;}
#notifications_page .notification_switch{position:relative;display:inline-block;width:42px;height:24px;margin:0;cursor:pointer;}
#notifications_page .notification_switch input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
#notifications_page .notification_switch_track{position:absolute;inset:0;border-radius:50px;background:#d9e3ee;transition:.3s;}
#notifications_page .notification_switch_track:before{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.13);transition:.3s;}
#notifications_page .notification_switch input:checked + .notification_switch_track{background:linear-gradient(90deg,#8b2cf5,#149cff);}
#notifications_page .notification_switch input:checked + .notification_switch_track:before{transform:translateX(18px);}
#notifications_page .notification_switch.disabled{opacity:.38;cursor:not-allowed;}

#notifications_page .notifications_save{display:flex;justify-content:flex-end;margin-top:26px;}
#notifications_page .notifications_save .notifications_btn{width:auto;min-width:180px;}

body.notifications{background:#010c24;}

@media(max-width:1024px){
#notifications_page{padding:60px 0 80px;}
#notifications_page .notifications_card{padding:28px;}
#notifications_page .notifications_setting_card{padding:30px;}
}

@media(max-width:767px){
#notifications_page{padding:45px 0 60px;}
#notifications_page .notifications_head{margin-bottom:26px;}
#notifications_page .notifications_title{font-size:32px;}
#notifications_page .notifications_desc{font-size:13px;}
#notifications_page .notifications_tabs{width:100%;}
#notifications_page .notifications_tabs a{flex:1;min-width:0;}
#notifications_page .notifications_top_grid{grid-template-columns:1fr;gap:16px;}
#notifications_page .notifications_card{padding:26px 20px;border-radius:14px;}
#notifications_page .notifications_setting_card{padding:24px 18px;border-radius:14px;}
#notifications_page .notifications_setting_head{align-items:flex-start;flex-direction:column;gap:5px;}
#notifications_page .notifications_table,
#notifications_page .notifications_table tbody{display:block;width:100%;}
#notifications_page .notifications_table thead{display:none;}
#notifications_page .notifications_table tbody{display:grid;grid-template-columns:1fr;gap:12px;}
#notifications_page .notifications_table tbody tr{display:block;width:100%;padding:14px 16px;border:1px solid #dfe9f3;border-radius:12px;background:#fff;}
#notifications_page .notifications_table tbody tr:hover td{background:transparent;}
#notifications_page .notifications_table tbody td{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;height:auto;padding:10px 0;border:0;border-bottom:1px solid #edf2f7;background:transparent;text-align:right;}
#notifications_page .notifications_table tbody td:last-child{border-bottom:0;}
#notifications_page .notifications_table tbody td:before{content:attr(data-label);flex:0 0 110px;color:#8699b0;font-weight:600;text-align:left;}
#notifications_page .notifications_table .notification_name{align-items:flex-start;}
#notifications_page .notifications_save{justify-content:stretch;}
#notifications_page .notifications_save .notifications_btn{width:100%;}
}

@media(max-width:500px){
#notifications_page{padding:35px 0 50px;}
#notifications_page .notifications_entitle{font-size:9px;}
#notifications_page .notifications_title{font-size:29px;}
#notifications_page .notifications_card{padding:23px 16px;}
#notifications_page .notifications_setting_card{padding:22px 14px;}
#notifications_page .notifications_card_head{align-items:flex-start;gap:11px;}
#notifications_page .notifications_card_icon{flex-basis:40px;width:40px;height:40px;}
#notifications_page .notifications_card_title{font-size:17px;}
#notifications_page .notifications_table tbody td:before{flex-basis:90px;}
}