* { font-family: serif; font-size: 15.2px!important; line-height: 1.4!important; font-weight: 700!important; text-shadow: none!important; -moz-user-select: none; -ms-user-select: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-text-size-adjust: 100%!important; text-size-adjust: 100%!important } @font-face { font-family: FontAwesome; src: url('../fonts/fontawesome-webfont.woff2?v=4.5.0') format('woff2'); font-weight: 400; font-style: normal; font-display: swap } .bg-primary,.btn-primary,.label-primary { background-image: none; background-color: var(--bt-primary)!important } #tlogins .th-login-tabs { margin: 0; background-color: #fff; height: 46px; width: 100%; clear: both; float: none!important; position: relative; z-index: 2 } .th-login-tab-link { padding: 10px 6px!important } .th-login-content { width: 100%; height: 74px } .th-login-pane { padding: 4px!important; width: 100% } .th-login-input { width: 206px; padding: 5px; border-radius: 2px; height: 33px } .th-login-guest-input { margin-top: 35px } .th-login-btn { margin-left: 7px } #tlogins .fa-eye,.th-stealth-btn { color: #000; padding: 4px; margin: 2px; border-radius: 4px } #tlogins .th-login-logo { flex: 0 0 24px; display: block; width: 24px; height: 24px; margin-right: 2px; object-fit: fill } #tlogins .th-login-banner-slot { display: block; width: 100%; float: none; clear: both; overflow: hidden; flex: 0 0 auto; max-height: 160px } #tlogins .isbnr.th-login-banner-defer,#tlogins .th-login-banner-defer { display: block; float: none!important; width: 100%; max-width: 100%; height: auto; max-height: 160px; object-fit: fill; background-size: 100% 100%; background-repeat: no-repeat; background-position: center center } .th-hidden-input { display: none } #story { border-bottom: 2px solid var(--bt-primary)!important } .bg { background-color: var(--bg-primary)!important } .light { background-color: var(--hi-light) } .mic_chat { position: absolute; top: 0; left: 0; width: 100%; display: flex; justify-content: flex-start; direction: ltr; background: var(--bt-primary); overflow: visible; flex-wrap: nowrap; z-index: 1 } @media only screen and (min-width: 360px) { #dpnl { width:73%!important } } .mic_chat::-webkit-scrollbar { display: none } .mic_chat>div>.micborder>hr { margin: 0; border-top-color: var(--bt-primary) } .mic_chat>div>.micborderr { background-image: var(--mic-url) } .daymsg .u-pic { background-image: var(--daymsg)!important } .btn-primary { color: #fff } .nav>li>a { position: relative; display: block; padding: 10px 15px } .uploadP { margin-left: 1px; margin-right: -1px; margin-top: 2px; height: 33px; border: 0!important; font-size: 15px!important; font-weight: 100!important; color: #fff; touch-action: manipulation } @keyframes fadeIn { from { opacity: 0; transform: scale(.95) } to { opacity: 1; transform: scale(1) } } @keyframes pulse { from { box-shadow: 0 4px 10px rgba(255,182,193,.6) } to { box-shadow: 0 8px 20px rgba(255,182,193,.8) } } .youtubeContainer { display: flex; width: 100%; flex-direction: row; overflow-x: auto } .fa-angle-up:before { content: '\f106' } .fa-angle-down:before { content: '\f107' } .fa-gamepad:before { content: '\f11b'; font-weight: 300!important } .vieYoutube { flex: 1 1 calc(20% - 10px); box-sizing: border-box; border: 1px solid #ddd; border-radius: 5px; background-color: #fff; padding: 10px; text-align: center; cursor: pointer; min-width: 120px } .youtubeContainer::-webkit-scrollbar { height: 8px } .youtubeContainer::-webkit-scrollbar-thumb { background: var(--bt-primary); border-radius: 4px } .youtubeContainer::-webkit-scrollbar-track { background: #e6e6e6 } .vieYoutube img { max-width: 100%; height: auto; border-radius: 5px } .vieYoutube:hover { border-color: #007bff; background-color: #f0f8ff } .fa-eye:before { content: '\f06e' } .fa-bullhorn:before { content: '\f0a1' } .fa-cog:before,.fa-gear:before { content: '\f013' } .fa-group:before,.fa-users:before { content: '\f0c0' } .fa-user:before { content: '\f007' } .fa-trash:before { content: '\f1f8' } .fa-image:before,.fa-photo:before,.fa-picture-o:before { content: '\f03e' } .fa-paper-plane:before,.fa-send:before { content: '\f1d8' } .fa-mail-reply:before,.fa-reply:before { content: '\f112' } .fa-heart:before { content: '\f004' } .fa-youtube:before { content: '\f167' } .fa-search:before { content: '\f002' } .fa-camera:before { content: '\f030' } .fa-comment:before { content: '\f075' } .fa-envelope-o:before { content: '\f003' } .fa-diamond:before { content: '\f219' } .fa-ban:before { content: '\f05e' } #settings .fa-ban:before { content: '\f00c'!important } #settings .fa-comments::before { font-weight: 300 } .fa-user-times:before { content: '\f235' } .fa-star:before { content: '\f005' } .fa-exclamation-triangle:before,.fa-warning:before { content: '\f071' } .fa-check:before { content: '\f00c' } .fa-close:before,.fa-remove:before,.fa-times:before { content: '\f00d' } .fa-comments:before { content: '\f086' } .fa-phone:before { content: '\f095' } .fa-microphone:before { content: '\f130' } .fa-stop:before { content: '\f04d' } .fa-play:before { content: '\f04b' } .fa-pause:before { content: '\f04c' } .fa-arrows:before { content: '\f047' } .fa-minus:before { content: '\f068' } .fa-volume-up:before { content: '\f028' } .fa-key:before { content: '\f084' } .fa-home:before { content: '\f015' } .fa-edit:before,.fa-pencil-square-o:before { content: '\f044' } .fa.fa-line-chart::before { content: "\f201"; font-family: FontAwesome } .fa-sign-out:before { content: '\f08b' } .fa-floppy-o:before,.fa-save:before { content: '\f0c7' } .fa-refresh:before { content: '\f021' } .fa-chrome:before { content: '\f268' } .fa-internet-explorer:before { content: '\f26b' } .fa-firefox:before { content: '\f269' } .fa-opera:before { content: '\f26a' } .fa-edge:before { content: '\f282' } .fa-scribd:before { content: '\f28a' } .fa-windows:before { content: '\f17a' } .fa-linux:before { content: '\f17c' } .fa-apple:before { content: '\f179' } .fa-times-circle:before { content: '\f057' } .fa-android:before { content: '\f17b' } .fa-th-large:before { content: '\f009' } .fa-bell:before { content: '\f0f3' } .fa-area-chart:before { content: '\f1fe' } .fa-expand:before { content: '\f065' } .fa-compress:before { content: '\f066' } .fa-bell-slash:before { content: '\f1f6' } .fa-plus:before { content: '\f067' } .fa-share-alt:before { content: '\f1e0' } .fa-plus-circle:before { content: '\f055' } .nav-tabs>li.active>a,.nav-tabs>li.active>a:focus,.nav-tabs>li.active>a:hover { color: #555; cursor: default; background-color: #fff; border: 1px solid #ddd; border-bottom-color: transparent } #d2bc>div.uzr.fl.borderg.MFT.mm { margin-bottom: -17px!important } #d2>div.uzr.d-flex.mm>div.uzr.flex-fill.break>div.d-flex.fr { display: none } .flex-fill { flex: 1 1 auto!important; overflow-y: hidden } a { color: #337ab7; text-decoration: none } .row { margin-right: -15px; margin-left: -15px } th { text-align: left } .fa-th-list::before { content: '\f00b'; font-weight: 300 } body>div.center-block.bg.dad>div.hand.corner.nosel>div { margin-top: 7px!important; padding: 0!important } .btn-success { color: #fff; background-color: #5cb85c; border-color: #4cae4c } .btn-success.focus,.btn-success:focus { color: #fff; background-color: #449d44; border-color: #255625 } .btn-success:hover { color: #fff; border-color: #398439 } .btn-info { color: #fff; background-color: #3ac2c3; border-color: #3ac2c3 } .btn-danger { color: #fff; background-color: #d9534f; border-color: #d43f3a } .btn-danger.focus,.btn-danger:focus { color: #fff; background-color: #c9302c; border-color: #761c19 } .btn-danger:hover { color: #fff; border-color: #ac2925 } .btn-danger .badge { color: #d9534f; background-color: #fff } .tab-content>.tab-pane { display: none } #dpnl>.tab-pane { display: none } #dpnl>.tab-pane.active { display: block } .fa-microphone-slash:before { content: '\f131' } .fa-volume-off:before { content: '\f026' } .fa-graduation-cap:before,.fa-mortar-board:before { content: '\f19d' } .fa-heartbeat:before { content: '\f21e' } .fa-comments::before { content: '\f086' } .fa-bars:before,.fa-navicon:before { content: '\f06d' } #bannerroomid,#rooms .bannerroom { display: none; margin: 0; padding: 0; background-color: rgba(32,32,32,.12); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; height: 151px; width: 100%!important; border-radius: 0!important; min-width: 100% } #rooms .DivBanner .bannerroom { display: block } #wall .Del_com { margin-top: 8px } #d2bc .thBcType-wall .Del_com { position: relative; z-index: 5; pointer-events: auto; clear: both; touch-action: manipulation; overflow: visible; overflow-x: visible; overflow-y: visible; -ms-overflow-style: none; scrollbar-width: none } #d2bc .thBcType-wall .Del_com>#delmsg,#d2bc .thBcType-wall .Del_com>.comm,#d2bc .thBcType-wall .Del_com>.like2 { position: relative; z-index: 6; pointer-events: auto; touch-action: manipulation } #d2bc .thBcType-wall .Del_com>.comm::before,#d2bc .thBcType-wall .Del_com>.like2::before { font-size: 92% } #d2bc .thBcType-wall .Del_com>.like2 .th-wall-like-count { font-size: inherit!important } #d2bc .thBcType-wall .u-msg.th-bc-msg-media { display: flex; flex-direction: column; flex-wrap: nowrap; align-items: stretch } #d2bc .thBcType-wall .u-msg.th-bc-msg-media>.th-bc-msg-body { flex: 1 1 auto; min-width: 0; width: 100%; max-width: 100%; overflow-wrap: anywhere; word-wrap: break-word; word-break: break-word; display: flex; flex-direction: column; align-items: flex-start; row-gap: 6px } #d2bc .thBcType-wall .u-msg.th-bc-msg-media>.Del_com { float: none; clear: none; flex: 0 0 auto; margin-top: 4px; margin-left: auto; margin-right: 0; align-self: flex-end } #d2bc .thBcType-chat .u-msg.th-bc-msg-media.th-bc-media-inline>.Del_com,#d2bc .thBcType-chat .u-msg.th-bc-msg-media.th-bc-media-inline>.thBcReact,#d2bc .thBcType-wall .u-msg.th-bc-msg-media.th-bc-media-inline>.Del_com { align-self: end; margin-top: -21px!important; } #d2bc .thBcType-chat .u-msg { display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-end; justify-content: flex-start; direction: ltr; column-gap: 4px; } #d2bc .thBcType-chat .u-msg.th-bc-msg-media { flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: 3px; } #d2bc .u-msg.th-bc-msg-media:not(.th-bc-media-inline)>.th-bc-msg-body>.fa-youtube,#d2bc .u-msg.th-bc-msg-media:not(.th-bc-media-inline)>.th-bc-msg-body>.th-bc-media-preview,#d2bc .u-msg.th-bc-msg-media:not(.th-bc-media-inline)>.th-bc-msg-body>audio,#d2bc .u-msg.th-bc-msg-media:not(.th-bc-media-inline)>.th-bc-msg-body>button,#d2bc .u-msg.th-bc-msg-media:not(.th-bc-media-inline)>.th-bc-msg-body>div:has(> button.fa-youtube-play),#d2bc .u-msg.th-bc-msg-media:not(.th-bc-media-inline)>.th-bc-msg-body>iframe,#d2bc .u-msg.th-bc-msg-media:not(.th-bc-media-inline)>.th-bc-msg-body>img.fitimg:not(.fitsticker),#d2bc .u-msg.th-bc-msg-media:not(.th-bc-media-inline)>.th-bc-msg-body>video { display: block; width: 100%; max-width: 100%; box-sizing: border-box; margin-top: 4px; margin-left: 0; margin-right: 0; } #d2bc .u-msg.th-bc-media-inline>.th-bc-msg-body>.th-bc-media-preview,#d2bc .u-msg.th-bc-media-inline>.th-bc-msg-body>button,#d2bc .u-msg.th-bc-media-inline>.th-bc-msg-body>div:has(> button.fa-youtube-play) { display: inline-block; width: auto; max-width: 100%; margin-top: 0 } .th-bc-msg-body { display: contents; } #d2bc .u-msg.th-bc-msg-media>.th-bc-msg-body>iframe { height: 160px; max-height: 160px } #d2bc .thBcType-wall .u-msg>.fa-youtube,#d2bc .thBcType-wall .u-msg>button.fa-youtube { position: relative; z-index: 1 } #d2bc .thBcType-wall .u-msg,#d2bc .thBcType-wall .uzr.flex-fill { overflow: visible; overflow-x: visible; overflow-y: visible } #d2bc .thBcType-chat .uzr.flex-fill,#d2bc .thBcType-wall .uzr.flex-fill { width: auto!important; max-width: 100%; min-width: 0; flex: 1 1 0%!important } .tab-content>#wall.active { display: flex!important; flex-direction: column; overflow: hidden; width: 100%; height: 100% } #wall>#d2bc { display: block; width: 100%; flex-grow: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch } #wall>.tablebox.light.d-flex { flex: 0 0 auto } body.bgm { height: 100%; min-height: 100%; max-height: 100%; margin: 0; padding: 0; overflow: hidden } .center-block.bg.dad { width: 100%; height: 100%; max-height: 100%; padding: 0 } .center-block.bg.dad:has(#tlogins) { max-width: 394px; margin-left: auto; margin-right: auto } .center-block.bg.dad:not(:has(#tlogins)) { max-width: none; margin-left: 0; margin-right: 0 } #tlogins { width: 100%; max-width: 390px; height: 100%; min-height: 100%; margin-left: -4px } #lonline { width: 100%; flex-grow: 1 } #room { width: 100%; height: 100%; min-height: 0; flex-direction: column; overflow: hidden } #room[style*="display: block"],#room[style*="display:block"] { display: flex!important } #d2 { display: block; width: 100%; flex-grow: 1; flex-shrink: 1; min-height: 0; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch } #room>.div_d2_box,#room>.isreply,.tablebox { flex: 0 0 auto } #dpnl { display: none!important; position: fixed; top: 0; right: 0; width: 320px; min-width: 300px; max-width: 340px; flex-direction: column; z-index: 3; border: 1px solid } #dpnl.th-dpnl-open { display: flex!important } .th-dpnl-head { width: 100%; display: flex; align-items: center; flex: 0 0 auto; min-height: 30px; direction: ltr } #dpnl>.th-dpnl-head>.pnhead { position: relative; flex: 1 1 auto; margin: 3px; padding-left: 10px; padding-right: 10px; min-width: 0; direction: rtl; text-align: left } #dpnl>.th-dpnl-head>.th-dpnl-close { flex: 0 0 auto; margin: 0 2px 0 0; border: 1px solid #000; border-radius: 6px!important; padding: 6px 8px } #chats,#rooms,#settings,#users { width: 100%; height: 100%; min-height: 0; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch } #wall { width: 100%; height: 100%; min-height: 0; overflow: hidden } #notF { display: block; width: 100%; flex-grow: 1; overflow-y: auto } .c-flex,.d-flex { flex: 0 1 auto } #d2 .Del_com,.bgg .Del_com { display: none!important } .viewers-list { display: none; background-color: #fff; color: #333; padding: 10px; border-radius: 10px; max-height: 400px; overflow-y: auto; position: absolute; bottom: 48px; left: 50%; transform: translateX(-50%); z-index: 1000; box-shadow: 0 4px 8px rgba(0,0,0,.2); width: 250px; border: 1px solid #ddd; font-family: Arial,sans-serif } .viewers-list ul { list-style-type: none; padding: 0; margin: 0 } .viewers-list li { font-size: 16px; padding: 8px 0; cursor: pointer; border-bottom: 1px solid #f1f1f1; transition: background-color .3s,padding-left .3s } .viewers-list li:hover { background-color: #f5f5f5; padding-left: 10px } .viewers-list strong { display: block; margin-bottom: 10px; font-weight: 700; font-size: 18px; color: #4caf50 } .modal-content { position: relative; background-color: #fff; -webkit-background-clip: padding-box; background-clip: padding-box; border: 1px solid rgba(0,0,0,.2); border-radius: 6px; outline: 0; -webkit-box-shadow: 0 3px 9px rgba(0,0,0,.5); box-shadow: 0 3px 9px rgba(0,0,0,.5) } .modal-backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1040; background-color: #000 } .modal-backdrop.fade { opacity: 0 } .modal-backdrop.in { opacity: .5 } .fa-youtube:before { content: '\f16a' } .popover { top: 0; left: 0; display: none; max-width: 276px; padding: 1px; font-family: helvetica neue,Helvetica,Arial,sans-serif; font-size: 14px; font-style: normal; font-weight: 400; line-height: 1.42857143; text-align: left; text-align: start; text-decoration: none; text-shadow: none; text-transform: none; letter-spacing: normal; word-break: normal; word-spacing: normal; word-wrap: normal; white-space: normal; background-color: #fff; -webkit-background-clip: padding-box; background-clip: padding-box; -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2); box-shadow: 0 5px 10px rgba(0,0,0,.2); line-break: auto } .popover.top { margin-top: 0 } .popover.right { margin-left: 10px } .popover.bottom { margin-top: 10px } .popover.left { margin-left: -10px } .tbox { white-space: pre-line!important } #tbox.box_text { white-space: pre-wrap!important; min-width: 0 } #tbox.box_text::placeholder { white-space: nowrap!important; overflow: hidden; text-overflow: ellipsis; opacity: 1 } .btn.active,.btn:active { background-image: none } .btn-primary:focus,.btn-primary:hover { background-position: 0 -15px } .btn-success:focus,.btn-success:hover { background-color: #419641; background-position: 0 -15px } .btn-success.active,.btn-success:active { background-color: #419641; border-color: #3e8f3e } .btn-danger:focus,.btn-danger:hover { background-color: #c12e2a; background-position: 0 -15px } .fa-arrow-left::before { content: '\f060' } .fa-arrow-right::before { content: '\f061' } .bgm { background-color: #40404f } .uhtml { border-bottom: 1px solid #e6e6fa } .uzr .fitimg { background-size: cover; margin: 0 } .as.borderg.fl.fitimg.hand.u-pic { width: 52px; height: 52px } .btn-primary,.label-primary { background-color: #000 } .bgg { background-color: #778899 } .pophead { background-color: #708090 } .fr { float: right } .fl { float: left } b,strong { font-weight: 700 } h1 { font-size: 2em; margin: .67em 0 } img { border: 0; vertical-align: middle } hr { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; height: 0; margin-top: 20px; margin-bottom: 20px; border: 0; border-top: 1px solid #eee } button,input,select,textarea { color: inherit; font: inherit; margin: 0 } button { overflow: visible } button,select { text-transform: none } [role=button],button,html input[type=button] { cursor: pointer } button[disabled],html input[disabled] { cursor: default } input { line-height: normal } textarea { overflow: auto } html { height: 100vh; width: 100vw; font-size: 10px } body { font-family: helvetica neue,Helvetica,Arial,sans-serif; font-size: 14px; line-height: 1.42857143; color: #333; background-color: #40404f } button,input,select,textarea { font-family: inherit; font-size: inherit; line-height: inherit } a:focus { outline-offset: -2px } label { display: inline-block; max-width: 100%; margin-bottom: 5px; font-weight: 700 } input[type=checkbox] { margin: 4px 0 0; line-height: normal } .form-control { display: block; width: 100%; height: 34px; padding: 6px 12px; color: #555; background-color: #fff; background-image: none; border-radius: 3px; border: 1px solid #727272; text-align: center } .nav { padding-left: 0; margin-bottom: 0; list-style: none } .nav>li { position: relative; display: block } .nav>li>a:focus,.nav>li>a:hover { text-decoration: none; background-color: #eee } .nav>li.disabled>a { color: #777 } .nav>li.disabled>a:focus,.nav>li.disabled>a:hover { color: #777; text-decoration: none; cursor: not-allowed; background-color: transparent } .nav .open>a,.nav .open>a:focus,.nav .open>a:hover { background-color: #eee; border-color: #337ab7 } .nav>li>a>img { max-width: none } .nav-tabs { border-bottom: 1px solid #ddd } .nav-tabs>li { float: left; margin-bottom: -1px } .nav-tabs>li>a { margin-right: 2px; line-height: 1.42857143; border: 1px solid transparent; border-radius: 4px 4px 0 0 } .nav-tabs>li>a:hover { border-color: #eee #eee #ddd } .tab-content>.active { display: block } .label { display: inline; padding: .2em .6em .3em; font-size: 75%; font-weight: 700; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .25em } a.label:focus,a.label:hover { color: #fff; text-decoration: none; cursor: pointer } .label:empty { display: none } .btn .label { position: relative; top: -1px } .label-success { background-color: #5cb85c } .label-success[href]:focus,.label-success[href]:hover { background-color: #449d44 } .label-info { background-color: #5bc0de } .label-info[href]:focus,.label-info[href]:hover { background-color: #31b0d5 } .label-warning { background-color: #f0ad4e } .label-danger { background-color: #d9534f } .label-danger[href]:focus,.label-danger[href]:hover { background-color: #c9302c } .badge { display: inline-block; min-width: 10px; font-size: 12px; font-weight: 700; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align: middle; background-color: #777; border-radius: 10px } .badge:empty { display: none } .btn .badge { position: relative; top: -1px } .close:focus,.close:hover { color: #000; text-decoration: none; cursor: pointer; opacity: .5 } button.close { padding: 0; cursor: pointer; background: 0 0; border: 0; -webkit-appearance: none; appearance: none } .modal-open { overflow: hidden } .modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1050; display: none; overflow: hidden; -webkit-overflow-scrolling: touch; outline: 0 } .modal.fade .modal-dialog { -webkit-transform: translate(0,-25%); -ms-transform: translate(0,-25%); -o-transform: translate(0,-25%); transform: translate(0,-25%); -webkit-transition: -webkit-transform .3s ease-out; -o-transition: -o-transform .3s ease-out; transition: transform .3s ease-out } .modal.in .modal-dialog { -webkit-transform: translate(0,0); -ms-transform: translate(0,0); -o-transform: translate(0,0); transform: translate(0,0) } .modal-open .modal { overflow-x: hidden; overflow-y: auto } .modal-dialog { position: relative; width: auto; margin: 10px } .modal-header { border-bottom: 1px solid #e5e5e5 } .modal-header .close { margin-top: -2px } .modal-title { margin: 0; line-height: 1.42857143 } .modal-footer { padding: 15px; text-align: right; border-top: 1px solid #e5e5e5 } .modal-footer .btn+.btn { margin-bottom: 0; margin-left: 5px } .modal-scrollbar-measure { position: absolute; top: -9999px; width: 50px; height: 50px; overflow: scroll } @media (min-width: 768px) { .modal-dialog { width:600px; margin: 30px auto } .modal-content { -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5); box-shadow: 0 5px 15px rgba(0,0,0,.5) } .modal-sm { width: 300px } } @media (min-width: 992px) { .modal-lg { width:900px } } .center-block { display: block; margin-right: auto; margin-left: auto } .pull-right { float: right!important } .hide { display: none!important } .show { display: block!important } .hidden { display: none!important } .fa::before { font-size: 92% } .u-msg { line-height: 1.5!important } .ae { border: 1px solid #000!important; border-radius: 2px!important; float: left; text-align: center; width: 20%; max-width: 80px; padding: 4px 0; margin: 1px 1px 2px } .btn:not(.uc),.label:not(.uc) { border-radius: 1px } button.btn:not(.TH_BC_TAB_V3):not(.TH_ROOM_TH_TAB_V3) { padding: 5px!important } .bgf { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px) } .msg { background-color: #f0f0f5; border: 1px solid grey; margin-top: -1px; padding: 2px; margin-right: 3px; margin-left: 3px } .tbox { border-radius: 1px; border: 1px solid #d3d3d3; padding: 6px; max-height: 32px; min-height: 32px; height: 32px; font-weight: 700; overflow: hidden; resize: none } .emoii { width: 22px; max-width: 22px; height: 22px; margin: 0; padding: 5px } .vhid { display: none!important } .noflow { overflow: hidden } .popover { overflow-y: auto; white-space: pre-wrap } .item3 { font-size: 16px!important; color: #000 } .item5 { color: gray } .grid-container { background: #f0f8ff; text-align: right; margin-left: 50px; padding: 8px; border-left: 6px solid #6495ed } .isreply .grid-container.th-room-reply,.u-rply .grid-container.th-room-reply { background: #edf4ff; border-left-color: #3b82f6; border-radius: 6px; text-align: left } .u-rply .grid-container.th-room-reply { margin-left: 0; border-left-width: 4px } .th-room-reply .item3,.th-room-reply .th-room-reply-who { color: #1d4ed8 } .th-room-reply .th-room-reply-on { color: #64748b; font-weight: 400 } .th-room-reply .item5 { color: #475569 } .active { color: #555; cursor: default; background-color: #fff; border-bottom-color: transparent } #pass1,#pass2,#u1,#u2,#u3 { padding: 5px; margin-bottom: 2px; border-radius: 2px; height: 33px; border: 1px solid rgb(0 0 0)!important } .fa-user-plus::before { content: '\f234' } .bgg div>div.uzr.flex-fill.break>div.d-flex.fr { display: none } span.flex-grow-1.dots { text-align: center } .mic_chat>div>.micborder>.fa-microphone { font-size: 16px!important; text-align: center; margin-top: 2px } .u-topic.dots { white-space: nowrap; max-width: 130% } .btn { display: inline-block; margin-bottom: 0; font-weight: 400; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid transparent; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; border-radius: 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } .pmsgc { background-color: rgba(0,77,255,.08)!important } .ppmsgc { background-color: #f1f1ff!important } .typingIndicatorBubbleDot { width: 4px; height: 4px; margin-right: 4px; background-color: #57585a; border-radius: 50%; animation-name: bounce; animation-duration: 1.3s; animation-timing-function: linear; animation-iteration-count: infinite } .typingIndicatorBubbleDot:first-of-type { margin: 0 4px } .typingIndicatorBubbleDot:nth-of-type(2) { animation-delay: .15s } .typingIndicatorBubbleDot:nth-of-type(3) { animation-delay: .3s } @keyframes bounce { 0%,100%,60% { transform: translateY(0) } 30% { transform: translateY(-4px) } } .hid { display: none } .hand { cursor: hand } .break { overflow: auto; word-wrap: break-word; overflow-x: hidden; overflow-wrap: break-word } .modal-body { position: relative } .u-ico { padding-right: 0; margin-top: 0; margin-left: 1px; min-height: 10px; max-height: 18px; display: inline-block; vertical-align: middle; flex-shrink: 0; background-size: contain; background-repeat: no-repeat; background-position: left center } .thUIcoEmpty,.u-ico.thUIcoEmpty { width: 0!important; height: 0!important; min-width: 0!important; min-height: 0!important; padding: 0!important; background: 0 0!important } .emoi { max-width: 260px; max-height: 24px } .unread { background-color: #ffc89d!important } div { line-height: 20px } .fa-commenting::before { content: '\f27a' } td,th { padding: 0 } .mini { font-size: 90%!important } .corner { border-radius: 5px } .minix { font-size: 80%!important } @keyframes animate { from { transform: scale(1) } to { transform: scale(1.5) } } .center { margin: 0 auto } .dots { display: inline-block; white-space: nowrap; overflow: hidden!important; text-overflow: ellipsis; max-width: 100% } .borderg { border: 1px solid #f4f4f4 } .border { border: 1px solid #000; border-radius: 2px!important } .fitimg { background-size: contain; background-repeat: no-repeat; background-position: 50% 50% } .bord { border-inline:4px solid #1e90ff!important} .modal-header { padding: 5px } .badge { padding: 0 3px } .tab-pane { padding: 0 } .popover-content { padding: 1px } .notification { min-width: 200px; max-width: 280px; z-index: 2000; position: relative; margin: .85rem auto 0; padding: 12px 12px 10px; border-radius: 10px; border: 1px solid; background: linear-gradient(165deg,#fafbfc 0,#f1f3f6 48%,#ebeef2 100%); display: flex; flex-direction: column; align-items: stretch; gap: 6px; overflow: hidden; transition: box-shadow .18s,transform .18s,border-color .18s; animation: .32s ease-out thNotifRevealT } @keyframes thNotifRevealT { from { opacity: 0; transform: translateY(5px) } to { opacity: 1; transform: translateY(0) } } .notification:active { transform: translateY(0) } .notification__title.label-primary { display: none } .notification__title.label-danger { border-radius: 6px!important; border: 1px solid rgba(127,29,29,.18)!important; box-shadow: 0 2px 8px rgba(127,29,29,.1) } .notification__sender { display: flex; align-items: center; gap: 8px; width: 100%; margin-top: 2px } .notification__sender__avatar { width: 30px; height: 30px; border-radius: 8px; margin-right: 0; object-fit: cover; border: 1px solid rgba(17,24,39,.08); background-color: rgba(255,255,255,.65); background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; box-shadow: 0 4px 12px rgba(15,23,42,.07); flex: 0 0 auto } .th-notif-toast-pic { display: block; background-color: #f3f3f3 } .notification__sender__name { margin: 0; font-size: .62rem; font-weight: 700; padding: 0; max-width: calc(100% - 38px); color: #1f2937; display: block; line-height: 1.35 } .notification p { margin-bottom: .35em } .notification__message { font-size: .62rem; font-weight: 600; margin-top: 0; width: 100%; padding: 7px 9px; word-break: break-word; border-radius: 8px; border: 1px solid rgba(17,24,39,.07); background: rgba(255,255,255,.58); line-height: 1.45; color: #111827; text-align: center } .notification__message span { display: block } .notification__time { position: absolute; top: .45rem; right: .55rem; font-size: .8rem!important; opacity: .55; color: #374151; letter-spacing: .01em } #feltr_msgs #notF .notification.thWatchCard { min-width: 0!important; max-width: none!important; width: calc(100% - 8px)!important; margin: 8px 4px 0!important; padding: 10px 12px 11px!important; border-radius: 9px!important; border: 1px solid rgba(17,24,39,.11)!important; background: linear-gradient(180deg,#fbfcfd 0,#f3f5f8 100%)!important; gap: 1px!important } #feltr_msgs #notF .notification.thWatchCard .notification__title { display: block!important; font-size: 11px!important; font-weight: 700!important; text-align: center!important; margin: 0 auto 3px!important; width: auto!important; min-width: 42%!important; max-width: 72%!important; padding: 1px 10px!important; line-height: 1.5!important; border-radius: 6px!important } #feltr_msgs #notF .thWatchCard__meta { display: flex!important; flex-direction: row-reverse; gap: 4px!important; width: 100%!important; padding: 3px 7px!important; border-radius: 7px!important; border: 1px solid rgba(17,24,39,.08)!important; background: rgba(255,255,255,.62)!important; justify-content: space-between } #feltr_msgs #notF .thWatchCard__row { display: flex!important; align-items: baseline!important; gap: 6px!important; width: 100%!important; direction: rtl!important } .thBcReactN { color: #000 } #feltr_msgs #notF .thWatchCard__label { flex: 0 0 auto!important; font-size: 14px!important; font-weight: 700!important; color: #d53535!important; font-family: inherit!important } #feltr_msgs #notF .thWatchCard__value { flex: 1 1 auto!important; min-width: 0!important; font-size: 13px!important; font-weight: 600!important; color: #111827!important; word-break: break-word!important; font-family: inherit!important } #feltr_msgs #notF .thWatchCard__value--goal { color: #1e3a5f!important } #feltr_msgs #notF .notification.thWatchCard .notification__sender { margin-top: 0!important; padding-top: 0!important; border-top: 0!important } .notification__sender__name .u-topic { border-radius: 5px; padding: 5px } #feltr_msgs #notF .thWatchCard__sectionLabel { width: 100%!important; margin-top: 2px!important; font-size: 14px!important; font-weight: 700!important; color: #4b5563!important; font-family: inherit!important; text-align: right!important; direction: rtl!important; display: none } #feltr_msgs #notF .notification.thWatchCard .notification__message,#feltr_msgs #notF .notification.thWatchCard .notification__message span,#feltr_msgs #notF .notification.thWatchCard .notification__sender__name { font-size: 15px!important; font-family: inherit!important } #feltr_msgs #notF .notification.thWatchCard .notification__message { margin-top: 2px!important; padding: 2px 9px!important; border-radius: 7px!important; background: rgba(255,255,255,.78)!important } #feltr_msgs #notF .notification.thWatchCard .notification__time { font-size: 10px!important; font-family: inherit!important } .flex-grow-1 { flex-grow: 1!important } .column { float: left; min-height: 100% } .row:after { content: ''; display: table; clear: both } #StoryProgress { width: 100%; background-color: #ddd } #BarStory { width: 0%; height: 3px; background-color: #6495ed; margin-bottom: 15px } .popover { z-index: 9000!important; position: fixed!important; height: 350px!important; min-width: 312px!important; border: 1px solid; border-radius: 0 } .mic_chat>div { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-start; justify-content: flex-start; direction: ltr; max-width: none; width: max-content; flex-shrink: 0 } .mic_chat>div>#mutedmicplay,.mic_chat>div>#mutedmicstop,.mic_chat>div>.th-mic-sound-off,.mic_chat>div>.th-mic-sound-on { order: 0 } .mic_chat>div>.mic5 { order: 1 } .mic_chat>div>.mic4 { order: 2 } .mic_chat>div>.mic3 { order: 3 } .mic_chat>div>.mic2 { order: 4 } .mic_chat>div>.mic1 { order: 5 } .mic_chat>div>.camlive,.mic_chat>div>.th-mic-cam { order: 6 } .mic_chat>div>.micborder { float: none; flex-shrink: 0; color: #113233; width: 53px; height: 50px; margin: 1px; border-radius: 4px; background-size: cover; background-repeat: no-repeat; background-position: center; border: 1px solid; transform: none } .mic_chat>div>.micborder.th-mic-locked { background-image: url(/imgs/lockmic.png)!important; background-position: center!important; background-repeat: no-repeat!important; background-size: 60%!important; pointer-events: auto } .mic_chat>div>.micborder.th-mic-locked>* { visibility: hidden!important } .mic_chat>div>.micborder img { padding: 2px } .c-flex { display: flex; flex-direction: column } .mic_chat>div>.micborder>.evant>i { position: relative; font-size: 16px!important; text-align: center; color: #906464; top: 36px; height: 18px; border-radius: 50%; background-color: #ffffffc7; border: 1px solid #d9534f70 } #tlogins .hand.nosel.fl.uzr.borderg { border: 1px solid #e0e0e0 } #d2 .MFT { background-size: 100%; border-radius: 0!important; width: 100%; margin-left: -1px!important } #settings .fa-bell-slash:before,#settings .fa-bell:before { float: left } #users .fl.u-pic { height: 56px!important; width: 56px!important } .Border_TH .light { border: 1px solid #d5d5d5 } #d2bc.fitimg.fl.u-pic { height: 49px!important; width: 55px!important } .story,.wall { background-color: #906464; color: #fff; margin: 4px; padding: 8px; width: 45%; border: 1px solid #000!important; text-align: center } .uhtml { text-align: left; width: 100%; margin: 0!important; padding-right: 1px; background-color: #fff } .uhtml .co.ico { display: inline-block; width: 18px; height: 18px; border-radius: 1px; margin-top: -2px; margin-left: 1px; background-size: 100% 100%; background-repeat: no-repeat; background-position: center center } .uhtml .laith-yt { display: inline-block; width: 18px; height: 18px; margin-top: -2px; margin-left: 1px; border: 0; border-radius: 1px; background: 0 0!important; cursor: pointer; vertical-align: middle; text-align: center; line-height: 18px!important; font-family: FontAwesome!important; font-size: 16px!important; font-weight: 400!important; font-style: normal; text-shadow: none!important; position: relative; z-index: 3; pointer-events: auto } .uhtml .laith-yt:before { font-family: FontAwesome!important; font-weight: 400!important; font-size: 18px!important; line-height: 18px!important } .uhtml .laith-yt.fa-youtube { color: red; margin-top: 0 } .uhtml .laith-yt.fa-instagram { color: #e1306c; margin-top: 1px } .uhtml .laith-yt.fa-tiktok { background: #000!important; border-radius: 2px; margin-top: 1px } #lonline .laith-yt,#lonline .uhtml .laith-yt { width: 18px; height: 18px; z-index: 6; border-radius: 2px!important; margin-top: 1px } .fa-instagram:before { content: '\f16d' } .fa-tiktok:before { content: ''!important; display: inline-block; width: 15px; height: 15px; vertical-align: middle; background-color: rgb(255 255 255); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M14.5 3h2.1c.2 1.5 1.2 2.8 2.6 3.4v2.2c-.9-.03-1.8-.3-2.6-.8v6.7c0 3.3-2.7 6-6 6s-6-2.7-6-6 2.7-6 6-6c.3 0 .6 0 .9.1v2.4c-.3-.1-.6-.2-.9-.2-2 0-3.6 1.6-3.6 3.6s1.6 3.6 3.6 3.6 3.6-1.6 3.6-3.6V3z'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M14.5 3h2.1c.2 1.5 1.2 2.8 2.6 3.4v2.2c-.9-.03-1.8-.3-2.6-.8v6.7c0 3.3-2.7 6-6 6s-6-2.7-6-6 2.7-6 6-6c.3 0 .6 0 .9.1v2.4c-.3-.1-.6-.2-.9-.2-2 0-3.6 1.6-3.6 3.6s1.6 3.6 3.6 3.6 3.6-1.6 3.6-3.6V3z'/%3E%3C/svg%3E") center/contain no-repeat; margin-top: -1px } .d-flex { display: flex } #chats .u-pic { width: 56px; height: 56px; min-width: 56px; min-height: 56px; max-width: 56px; max-height: 56px; flex-shrink: 0 } #chats .ustat { width: 3px!important; height: 56px!important } #chats .label-danger { border: 0 } #users .fl.ustat { width: 4px!important; height: 80px!important; margin: -2px } img.ustat.th-ustat-css { min-width: 4px!important; flex-shrink: 0!important; background-repeat: no-repeat!important; background-position: center!important; background-size: 100% 100%!important; object-fit: fill!important; image-rendering: auto!important } img.ustat.th-ustat-s0 { background-color: #4fdd79!important } img.ustat.th-ustat-s1 { background-color: #ffc90e!important } img.ustat.th-ustat-s2 { background-color: #ed1c24!important } img.ustat.th-ustat-s3 { background-color: #c8d5e6!important } img.ustat.th-ustat-s4 { background-color: #00a2e8!important } img.ustat.th-ustat-s5 { background-color: #98b5bc!important } img.ustat.th-ustat-s6 { background-color: #c8d5e6!important } #users .hand.nosel.fl.uzr.borderg { border: 1px solid #e6e6fa!important; text-align: left!important; width: 107%!important; margin: 0 0 -2px!important; border-bottom: 1px solid #f2f2ff!important; padding-right: 1px!important; cursor: pointer; background-size: 100% 100%!important } #users .fr.co { right: 0; position: sticky } #users .u-topic.dots { margin-left: 1px!important; margin-top: 2px!important } #dpnl .uhash { position: relative } #users .fl.hand.nosel.uzr.uhtml { text-align: left; width: 100%; margin: 0!important; border-bottom: 1px solid #e6e6fa; padding-right: 1px; background-color: #fff; background-size: 100% 100%!important } #users .u-msg { margin-top: 0 } #TH_WETCH .fl.borderg.corner.uzr { margin-left: 2px!important; border-radius: 37px; height: 71px; border: 1px solid #5f92a1; box-shadow: 7px 7px 50px #a4afc5 } #ZAYWETCH_TH { background: #e91e63db!important; color: #fff; border-radius: 80px 80px 0 0!important; border: 0 } #TH_WETCH img.corner.borderg.fl { width: 80px!important; height: 69px!important; border-radius: 50%; margin: 0; border: 0 } #TH_WETCH .u-topic.dots { display: flex; align-items: baseline; margin: 5px 0 0 } #TH_WETCH .break.fl { text-align: center; color: #fff; position: relative; margin: -34px 0 0 92px; border-radius: 4px; font-family: el messiri,FontAwesome!important; width: 67%!important; font-weight: 300!important } #TH_WETCH .hand.corner.wetchnot { display: block } #d2>div.uzr.d-flex.pmsgcx2>.btn-like.fr,#d2>div.uzr.d-flex.pmsgcx2>div.btn.minix.btn-primary.fa.fa-reply.fr,#d2>div.uzr.d-flex.pmsgcx2>div.btn.minix.btn-primary.fa.fa-times.fr,#d2>div.uzr.d-flex.pmsgcxx>.btn-like.fr,#d2>div.uzr.d-flex.pmsgcxx>div.btn.minix.btn-primary.fa.fa-reply.fr,#d2>div.uzr.d-flex.pmsgcxx>div.btn.minix.btn-primary.fa.fa-times.fr { display: none!important } .dpnl { border: 0!important } #chats .fl.mini.u-msg.dots { margin-top: 0!important } #upro iframe,#users iframe { min-width: 240px; top: 69px; display: inline-block; position: absolute; height: 256px; left: 0; margin: 0 } .ntop { width: 33px; display: inline-block; margin: 0 0 0 -10px; padding: 13px 0 0 7px!important; background-size: 121% 114%!important; background-repeat: no-repeat; height: 39px } #top10>div.ltop>div:first-child { background-color: #ffb850!important } #top10>div.ltop>div:nth-child(2) { background-color: #cddc39!important } #top10>div.ltop>div:nth-child(3) { background-color: #00bcd4!important } #top10>div.ltop>div:nth-child(4) { background-color: #f5bdff!important } #top10>div.ltop>div:nth-child(5) { background-color: #41efa3!important } #top10>div.ltop>div:nth-child(6) { background-color: #58ff5f!important } #top10>div.ltop>div:nth-child(7) { background-color: #eb73ff!important } textarea#usearch::placeholder { color: #fff } #more .fa-youtube:before { color: red; font-weight: 200 } .bg,.bgm,.fl,button,label { outline: 0; -webkit-tap-highlight-color: transparent; -moz-user-select: text; -webkit-user-select: text; -ms-user-select: text; user-select: text } #room>div.div_d2_box>div.menu_none>div>button.UPLOAD_TIGRROOM.sndfilebc.fa-plus::before { display: none } .VBORB.dslita div { margin-top: -7px; border: 2px solid #000; width: 83px; height: 84px; margin-left: 5px; margin-bottom: 5px; background-size: 100%; display: inline-table } .VBORB.dslita { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px } .VBOR.dslists div { border: 2px solid #000; width: 97%; height: 100px; margin-left: 5px; margin-bottom: 5px; background-size: 100% 100% } #d0 .label-warning { background-color: #0000!important; color: orange } #rooms .fl.u-pic { height: 58px!important; border: 1px solid #a4a4a4!important; margin-left: -2px; min-height: 58px; max-height: 58px; width: 58px!important } .bgg .fl.ustat { height: 20px!important } #rooms .bord { border-right: 4px solid #1e90ff!important; padding: 0!important; border-left: 4px solid #1e90ff!important } .star.ashh { display: none } .uhtml .u-pic { min-width: 52px; width: 52px; min-height: 52px; max-height: 63px; background-color: #f3f3f3; flex-shrink: 0 } .flex-fill { flex: 1 1 auto!important } #settings .tc { border-radius: 3px!important; padding: 7px!important; border: 1px solid #2b2b2b!important; margin: 2px 0 0 1px!important; width: 99.6%!important } .is_speaking { box-shadow: 0 0 0 3px rgb(0 200 45 / 83%) } #blockpro { margin: 16px 0 0 -18px!important; z-index: 2 } textarea:focus { outline: 0; box-shadow: none } span#name { height: 26px!important; padding: 5px 0 0 1px!important; top: 12px!important; right: 1px; width: 53px; border-radius: 0 0 6px 6px; background: #ffffffa8!important; margin-top: 12px; color: #000!important } #users .d-flex.fl { max-height: 200px } .fa { display: inline-block; font: 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } .camlive video { position: absolute; height: 270px; right: 0; margin: 338px -3px 0 28px; border-radius: 0; display: block!important; border: 3px solid #4caf50; filter: drop-shadow(2px 2px 4px black); z-index: 0; cursor: pointer; pointer-events: auto } .th-cam-viewer-box { position: fixed; right: 12px; top: 90px; width: 260px; height: 230px; min-width: 180px; min-height: 150px; max-width: 94vw; max-height: 88vh; z-index: 0; display: flex; flex-direction: column; background: #141414; border: 2px solid #4caf50; border-radius: 12px; overflow: hidden; box-shadow: 0 10px 28px rgba(0,0,0,.45); user-select: none; -webkit-user-select: none } .th-cam-viewer-box.th-cam-viewer-lg { width: 260px; height: 230px } .th-cam-viewer-bar { display: flex; align-items: center; gap: 6px; padding: 6px 8px; background: linear-gradient(180deg,#303030 0,#222 100%); cursor: default; touch-action: none; flex-shrink: 0 } .th-cam-viewer-spacer { flex: 1 1 auto; min-width: 4px } .th-cam-viewer-grip { flex: 0 0 auto; min-width: 18px; color: #9ae6a4; font-size: 14px; line-height: 26px; margin-left: 2px } .th-cam-viewer-move { background: #1565c0; cursor: move } .th-cam-viewer-move:active { background: #0d47a1 } .th-cam-viewer-btn { width: 28px; height: 28px; border: 0; border-radius: 6px; background: #3a3a3a; color: #fff; cursor: pointer; padding: 0; line-height: 28px; text-align: center; flex-shrink: 0; font-family: FontAwesome } .th-cam-viewer-btn .fa { font: 14px/28px FontAwesome; display: inline-block } .th-cam-viewer-btn:active { background: #555 } .th-cam-viewer-play { background: #2e7d32 } .th-cam-viewer-box.th-cam-viewer-paused .th-cam-viewer-play { background: #1565c0 } .th-cam-viewer-vol { width: 70px; height: 18px; margin: 0 2px; cursor: pointer; flex-shrink: 0 } .th-cam-viewer-body { position: relative; flex: 1 1 auto; min-height: 0; background: #000; line-height: 0; overflow: hidden } .th-cam-viewer-overlay { display: none; position: absolute; inset: 0; z-index: 2; align-items: center; justify-content: center; background: rgba(0,0,0,.45); color: #fff; font-size: 42px; cursor: pointer } .th-cam-viewer-overlay .fa { font: 42px/1 FontAwesome } .th-cam-viewer-box.th-cam-viewer-paused .th-cam-viewer-overlay { display: flex } .th-cam-viewer-resizer { position: absolute; right: 0; bottom: 0; width: 28px; height: 28px; background: linear-gradient(135deg,transparent 48%,#ff9800 48%,#ff9800 58%,transparent 58%,transparent 68%,#ff9800 68%,#ff9800 78%,transparent 78%); border-right: 4px solid #ff9800; border-bottom: 4px solid #ff9800; border-bottom-right-radius: 10px; cursor: nwse-resize; pointer-events: auto; z-index: 5; box-shadow: -2px -2px 0 rgba(0,0,0,.25) } .th-cam-viewer-box.th-cam-viewer-min { width: auto!important; height: auto!important; min-width: 0; min-height: 0 } .th-cam-viewer-box.th-cam-viewer-min .th-cam-viewer-body,.th-cam-viewer-box.th-cam-viewer-min .th-cam-viewer-mute,.th-cam-viewer-box.th-cam-viewer-min .th-cam-viewer-play,.th-cam-viewer-box.th-cam-viewer-min .th-cam-viewer-resizer,.th-cam-viewer-box.th-cam-viewer-min .th-cam-viewer-vol { display: none!important } .th-cam-viewer-box #automice2,.th-cam-viewer-box video#automice2 { position: absolute!important; inset: 0!important; display: block!important; width: 100%!important; height: 100%!important; max-height: none!important; margin: 0!important; border: 0!important; border-radius: 0!important; filter: none!important; cursor: default!important; background: #000; object-fit: contain } .th-cam-owner-box { border-color: #66bb6a } .fa-video-camera:before { content: '\f03d'; margin: 0 4px 0 -2px } .mic_chat>div>.micborder.camlive { background-image: url(/imgs/camm.webp); background-size: 117% } #tlogins .u-msg { max-height: 40px; color: #888 } @font-face { font-family: el messiri; font-style: normal; font-weight: 400; src: local('El Messiri'),url(/fonts/ElMessiri.woff) format('woff') } #more .fa::before { position: static!important } #more .fa-bell-slash:before,#more .fa-bell:before,#more .fa-send:before { float: inline-start } #users .u-msg { float: unset; max-height: 130px!important; margin-left: 4px } #mkr input[type=checkbox] { margin: 0 5px -5px 0 } #story::-webkit-scrollbar { display: none } #story video.fitimg.u-pic.borderg { cursor: pointer; border-radius: 6px!important; background-size: cover; overflow: hidden; flex-direction: column; position: relative; margin-bottom: 10px; object-fit: cover!important; min-width: 45px!important; width: 54px!important; height: 73px!important } #story .story-thumb { position: relative!important; width: 66px!important; border-radius: 50%!important; display: flex!important; align-items: center!important; justify-content: center!important } #story .story-thumb .u-pic { width: 60px!important; height: 60px!important; min-width: 60px!important; min-height: 60px!important; max-width: 60px!important; max-height: 60px!important; border-radius: 50%!important; object-fit: cover!important; display: block!important; margin: 0!important; padding: 0!important; border: 0!important } #story .story-thumb.highlighted::after,#story .story-thumb.highlighted::before { content: ''; position: absolute; border-radius: 50%; animation: 10s linear infinite rotateBorder; pointer-events: none } #story .story-thumb.highlighted::before { top: -2px; left: -2px; right: -2px; bottom: -2px; border-left: 2px dashed #ff8000; border-bottom: 1px dashed #ff66b2; border-right: 1px solid #dc0be5; border-top: 1px solid #ff1e8e } #story .story-thumb.highlighted::after { top: -3px; left: -3px; right: -3px; bottom: -3px; animation-delay: 1s } #story>div.itemstory>div.str>div:nth-child(2) { position: absolute; bottom: .1rem; font-size: .4rem!important; color: #fff!important; margin-bottom: 5px; margin-left: 3px } #wall .uzr .btn.fa.fa-youtube::before { margin-left: 8px; margin-right: 11px; display: flex; align-items: center; font-size: 39px } #d2bc>div.uzr.d-flex.mm>div>div.u-msg.break>button { margin-top: -5px } #d2bc>div.uzr.d-flex.mm>div>div.u-msg.break>.fa-youtube { margin-top: 8px } .fa-image:before,.fa-photo:before,.fa-picture-o:before { margin-right: 5px } @keyframes fadeInUp { 0% { opacity: 0; transform: translateX(-50%) translateY(30px) } 100% { opacity: 1; transform: translateX(-50%) translateY(0) } } .fa-wifi:before { content: '\f1eb' } #upro { overflow: auto; padding-left: 0!important } .modal-body { padding: 10px } .highlighted { border: 0!important } #upro .highlighted::before { top: -2px; left: -2px; right: -2px; bottom: -2px; border-left: 4px dashed #ff8000; border-bottom: 2px dashed #ff66b2; border-right: 3px solid #dc0be5; border-top: 3px solid #ff1e8e } #upro .highlighted::after,#upro .highlighted::before { content: ''; position: absolute; border-radius: 50%; animation: 10s linear infinite rotateBorder } #upro .highlighted::after { top: -3px; left: -3px; right: -3px; bottom: -3px; animation-delay: 1s } @keyframes rotateBorder { 0% { transform: rotate(0) } 100% { transform: rotate(360deg) } } #upro .fa.fa-star.checked { color: #ffc047; font-weight: 300!important } #upro .fa.fa-star:not(.th-upro-green):not(.ubnr) { font-weight: 300!important; color: #bbbbbb8f } #tlogins .fa.fa-star.new-checked { color: var(--bt-primary)!important; font-weight: 300!important; font-size: 13px!important } #tlogins .fa.fa-star { font-weight: 300!important; color: #9595958f!important; margin-top: 4px; margin-bottom: -2px; font-size: 13px!important } .u-pic-style2 { border-radius: 122px!important; margin: 5px -10px 10px -71px!important; background-size: 100% 100%!important; height: 60px!important; width: 62px!important; min-width: 60px!important; min-height: 60px!important; max-height: 60px!important } .u-msg-style2 { font-family: 'El Messiri',FontAwesome!important; font-size: 14px!important; display: block; max-height: 129px!important; overflow-wrap: anywhere!important; margin-left: 25px } .u-ico-style2 { margin-left: 17px } .u-topic-style2 { margin-left: 3px; border-radius: 2px; padding: 1px } .u-topic-style1 { margin-left: 2px; border-radius: 2px; padding: 1px } .u-pic-style1 { width: 54px; min-width: 54px } .yes-style-u-msg { max-height: 129px!important; overflow-wrap: anywhere!important; margin-top: 0 } .cover-style2 { width: 80px; margin: -4px 0 0 -2px!important; padding: 40px; height: 80px!important; position: relative!important; border: 0; display: block!important } #lonline>div>div.d-flex.fl>div>div.new-stars_users_uhtml { justify-content: flex-end } #rooms .DivBanner { display: flex; margin-bottom: 0; align-items: center; flex-direction: column; position: relative } #rooms .DivBanner .u-topic-baner { position: absolute; left: 0; margin-top: -148px; font-family: 'El Messiri',FontAwesome!important } #rooms .u-msg-baner { display: none } #rooms .uc-baner { margin-top: -31px!important; width: 338px; margin-left: 0!important; background-color: #3939395e!important } #chats div.fl.hand.nosel.uzr.uhtml>div.c-flex.fr>img { display: none } @keyframes gradientAnimation { 0%,100% { background: #ff9f68 } 33% { background: #ff6b6b } 66% { background: #6bbaff } } button.filter_notf { background: #000!important; color: #fff!important; border: none; transition: none!important; animation: none!important } button.filter_notf:before { position: relative; z-index: 2; color: #fff!important } button.filter_notf::after { content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 2px; box-sizing: border-box; pointer-events: none; z-index: 0; background: conic-gradient(#ff2bd6,#3d9eff,#ffe14a,#ff7a18,#ff2bd6); -webkit-mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); mask-composite: exclude } button.filter_notf .notification-count { position: relative; z-index: 3 } .like-container { pointer-events: auto!important; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: rgba(255,255,255,0.18); align-items: flex-start!important; z-index: 10050!important } .like-container:before { content: ''; position: absolute; top: -20px; right: -20px; bottom: -20px; left: -20px; background: rgba(0,0,0,.01); z-index: 0 } .like-btn { font-size: 28px!important; cursor: pointer; user-select: none; transition: transform .2s; position: relative; z-index: 1; display: block; line-height: 1; margin-left: -2px; touch-action: manipulation; -webkit-tap-highlight-color: rgba(255,255,255,0.18) } .like-btn:before { content: ''; position: absolute; top: -16px; right: -16px; bottom: -16px; left: -16px; background: rgba(0,0,0,.01) } .like-btn.liked { color: red; transform: scale(1.2) } .like-count { width: 28px; text-align: center; margin-left: -2px; font-size: 18px!important; color: #fff } #StoryPanel .story-arrow-left { pointer-events: none!important; opacity: 0!important } .burst { position: absolute; top: 0; left: 50%; transform: translateX(-50%); pointer-events: none; z-index: 10 } .dot { position: absolute; width: 18px; height: 18px; border-radius: 50%; opacity: 0; animation: .6s forwards burst } @keyframes burst { 0% { transform: scale(.5) translate(0,0); opacity: 1 } 100% { transform: scale(1.5) translate(var(--dx),var(--dy)); opacity: 0 } } #story-comment-input { color: #000 } .fa-bookmark::before { font-family: FontAwesome; content: '\f02e'; display: inline-block } .daymsg,.welcpic { background-color: rgba(0,77,255,.08)!important } .hmsg { background-color: linen!important } div.uzr.d-flex.Welcome_user .u-ico { display: none } .hostwelcome { font-size: 10px!important; font-weight: 700; color: transparent; background-image: linear-gradient(90deg,#ff7eb3,#ff758c,#a591e2,#758cff); background-size: 200%; -webkit-background-clip: text; background-clip: text!important; animation: 3s linear infinite glow; font-family: 'el messiri' } @keyframes glow { 0%,100% { background-position: 0 50% } 50% { background-position: 100% 50% } } @supports not (--css: variables) { .hostwelcome { color:#ff7eb3; background: 0 0 } } .idboot .Del_com { display: none } .loginItmsS,.loginItmsS1 { opacity: 0; transform: translateX(-100%); animation: 7s ease-in-out forwards slideInOut } @keyframes slideInOut { 0%,100% { opacity: 0; transform: translateX(-100%) } 10%,85% { opacity: 1; transform: translateX(0) } } .loginItms { position: absolute; display: none; border: 2px solid #ddd; background: -webkit-linear-gradient(135deg,#bcbcbc,#4caf50)!important; box-shadow: 7px 7px 50px #a4afc5; border-radius: 25px 0; right: 0; top: 30px; width: 250px; height: 51px } .loginItmsS { position: absolute; display: none; background-image: url(/imgs/l1.png?v=20260726a)!important; background-repeat: no-repeat; background-size: 100% 100%; left: 0; top: 43px; width: 327px; height: 179px } .loginItmsS1 { position: absolute; display: none; background-image: url(/imgs/l2.png?v=20260726a)!important; background-repeat: no-repeat; background-size: 100% 100%; left: 0; top: 43px; width: 325px; height: 178px } .loginImg { float: right; width: 46px; height: 43px; border: 1px solid #ddd; margin: 1px; background-size: cover; background-repeat: no-repeat; border-radius: 50% } .loginImgG { float: right; width: 67px; height: 74px; margin: 35px 216px 1px 1px; background-size: cover; border-radius: 50%; box-shadow: 0 0 0 2px #efa9c54a } .loginImgG1 { float: right; width: 66px; height: 68px; margin: 39px 215px 1px 1px; background-size: cover; border-radius: 50%; box-shadow: 0 0 0 5px #ecbf6d45 } .loginLogo { float: right; margin: -20px 1px 1px } .loginLogoO,.loginLogoO1 { float: right; margin: -20px 1px 1px; display: none } .loginIco,.loginIcoO { float: right; margin: 0 1px 1px; max-height: 18px; background-color: #fff; padding: 1px; border-radius: 2px } .loginFlog { float: left; margin: 2px 0 5px 5px; max-height: 15px } .loginFlogG,.loginFlogG1 { float: left; margin: 2px 0 5px 5px; max-height: 15px; display: none } .loginUserName { font-size: 16px!important; font-weight: 9000; max-width: 170px; min-width: 100px; text-align: right; text-shadow: -1px 1px 2px #fff; color: #eee; white-space: nowrap; overflow: hidden!important; text-overflow: ellipsis; float: left; font-family: el messiri,FontAwesome!important } .loginUserNameE,.loginUserNameE1 { max-width: 168px; min-width: 100px; white-space: nowrap; overflow: hidden!important; text-overflow: ellipsis; font-family: el messiri,FontAwesome!important; margin-left: 43px; float: right; width: 150px } .loginUserNameE { color: #000; margin-top: -32px; margin-right: 42px } .loginUserNameE1 { color: #0c0c0c; margin-top: -37px; margin-right: 32px } #more.thMoreIOS { height: 100%; width: 100%; overflow-y: auto; overflow-x: hidden; padding: 14px 10px 20px; border: 0!important; background: radial-gradient(circle at 100% 0,rgba(167,139,250,.28) 0,transparent 42%),radial-gradient(circle at 0 100%,rgba(236,72,153,.2) 0,transparent 44%),radial-gradient(circle at 50% 0,rgba(96,165,250,.18) 0,transparent 40%),linear-gradient(165deg,#37156f 0,#42106f 48%,#1e3a8a 100%)!important; color: #334155; font-family: Cairo,'El Messiri',system-ui,sans-serif; -webkit-overflow-scrolling: touch } .thMoreHead { margin: 4px 6px 14px; padding: 14px 12px; border-radius: 18px; background: linear-gradient(135deg,#0f172a,#1e293b); color: #fff; box-shadow: 0 10px 24px rgba(15,23,42,.18) } .thMoreHeadTitle { font-size: 16px; font-weight: 800; line-height: 1.3 } .thMoreHeadSub { margin-top: 4px; font-size: 12px; font-weight: 600; color: rgba(255,255,255,.72) } .thMoreSub { margin: 4px 10px 8px; padding: 0 4px; font-size: 11px; font-weight: 800; color: #94a3b8; letter-spacing: .15px; display: flex; align-items: center; gap: 6px } .thMoreSubNum { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; font-size: 10px; font-weight: 800; color: #64748b; background: linear-gradient(135deg,#fff 0,#f1f5f9 100%); border: 1px solid rgba(148,163,184,.28); box-shadow: 0 1px 4px rgba(148,163,184,.1) } .thMoreDivider { height: 1px; margin: 10px 14px 12px; background: linear-gradient(90deg,transparent 0,rgba(148,163,184,.35) 18%,rgba(148,163,184,.35) 82%,transparent 100%); position: relative } .thMoreDivider::after { content: ''; position: absolute; left: 50%; top: 50%; width: 5px; height: 5px; margin: -2px 0 0 -2px; border-radius: 50%; background: #cbd5e1; box-shadow: -14px 0 0 #e2e8f0,14px 0 0 #e2e8f0 } .thMoreGroup { background: 0 0; border-radius: 0; overflow: visible; border: 0; box-shadow: none; margin: 0 4px 4px; display: flex; gap: 8px; justify-content: center; flex-direction: column } .thMoreNum { flex: 0 0 auto; min-width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; font-size: 11px; font-weight: 800; line-height: 1; color: #64748b; background: linear-gradient(145deg,#fff 0,#f8fafc 100%); border: 1px solid rgba(148,163,184,.24) } .thMoreRow { width: 100%; border: 0; background: linear-gradient(135deg,rgba(255,255,255,.99) 0,rgba(248,250,252,.95) 100%); border-radius: 10px; display: flex; align-items: center; gap: 10px; padding: 9px 12px; cursor: pointer; position: relative; direction: ltr; text-align: left; box-shadow: none; -ms-touch-action: manipulation; touch-action: manipulation } #more.thMoreIOS .thMoreRow { background: linear-gradient(135deg,rgba(216,180,254,.46) 0,rgba(244,114,182,.34) 52%,rgba(167,139,250,.28) 100%); border-color: rgba(244,114,182,.34) } #more.thMoreIOS .thMoreRow .thMoreNum { color: #fff; border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.14) } #more.thMoreIOS #gameinvite,#more.thMoreIOS .thMoreRow[data-key=notification] { background: linear-gradient(135deg,rgba(255,45,120,.92) 0,rgba(236,72,153,.82) 52%,rgba(217,70,239,.72) 100%); border-color: rgba(251,113,183,.58) } #more.thMoreIOS .thMoreRow[data-key=TH_WETCH] { background: linear-gradient(135deg,rgba(0,245,255,.58) 0,rgba(56,189,248,.44) 52%,rgba(37,99,235,.32) 100%); border-color: rgba(125,249,255,.45) } #more.thMoreIOS #nowalltoggle { background: linear-gradient(135deg,rgba(57,255,20,.68) 0,rgba(0,220,100,.58) 52%,rgba(0,180,180,.48) 100%); border-color: rgba(190,255,100,.46) } .thMoreIcoTeal { background: linear-gradient(135deg,#6ee7d8,#2dd4bf); color: #0f766e } #more.thMoreIOS #mute,#more.thMoreIOS #mute1 { background: linear-gradient(135deg,rgba(0,245,255,.95) 0,rgba(0,180,255,.86) 52%,rgba(0,92,255,.78) 100%); border-color: rgba(125,249,255,.7) } #more.thMoreIOS .thMoreRow[data-key=borderbackground] { background: linear-gradient(135deg,rgba(244,114,182,.95) 0,rgba(217,70,239,.88) 52%,rgba(147,51,234,.82) 100%); border-color: rgba(251,207,232,.62) } #more.thMoreIOS .thMoreRow[data-key=borderbackground] .thMoreNum { color: #fdf4ff; border-color: rgba(255,255,255,.42); background: linear-gradient(145deg,rgba(255,255,255,.26) 0,rgba(217,70,239,.34) 100%) } #more.thMoreIOS .thMoreRow[data-key=borderbackground] .thMoreIco { background: linear-gradient(135deg,#fbcfe8 0,#d946ef 100%); color: #581c87 } #more.thMoreIOS .thMoreRow[data-key=borderbackground] .thMoreText { color: #fff } #more.thMoreIOS .thMoreGroup>.thMoreRow .thMoreTxt { color: #fff } #more.thMoreIOS .thMoreGroup>.thMoreRow .thMoreCh { color: rgba(100,116,139,.45) } .thMoreRow:active { transform: scale(.985); filter: brightness(.98) } .thMoreRow+.thMoreRow { border-top: 0 } .thMoreTxt { flex: 1; font-size: 14px!important; font-weight: 700; direction: rtl; text-align: right; color: #0f172a; font-family: 'El Messiri',Cairo,sans-serif!important } .thMoreCh { color: rgba(15,23,42,.28); font-size: 22px; line-height: 1; padding-left: 2px; font-weight: 300 } .thMoreIco { width: 38px; height: 38px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; box-shadow: none; border: 1px solid rgba(255,255,255,.82) } @media (max-width: 480px) { #more.thMoreIOS { padding:10px 8px 16px } .thMoreRow { padding: 11px 10px; border-radius: 14px; gap: 8px } .thMoreNum { min-width: 22px; height: 22px; font-size: 10px } .thMoreIco { width: 34px; height: 34px } .thMoreTxt { font-size: 13px!important } .thMoreDivider { margin: 8px 10px 10px } } .thMoreIco .fa { font-size: 15px; position: static!important; left: auto!important } .thMoreIcoPink { background: linear-gradient(135deg,#ff9acb,#ff6fae); color: #8f2457 } .thMoreIcoOrange { background: linear-gradient(135deg,#ffc66b,#ff9f32); color: #8a4c00 } .thMoreIcoPurple { background: linear-gradient(135deg,#b79cff,#9274f4); color: #4f2c91 } .thMoreIcoBlue { background: linear-gradient(135deg,#76d4ff,#38bdf8); color: #075985 } .thMoreIcoGreen { background: linear-gradient(135deg,#6ee7b7,#34d399); color: #065f46 } #more.thMoreIOS .thMoreRow[data-key=thXoTrend] .thMoreIcoGreen { background: linear-gradient(135deg,#ff9acb,#ff6fae); color: #8f2457 } #more.thMoreIOS .thMoreRowHero .thMoreIcoGreen { background: linear-gradient(135deg,#fed7aa,#fb923c); color: #7c2d12 } .thMoreIcoViolet { background: linear-gradient(135deg,#d5a6ff,#b66df1); color: #6b21a8 } .thMoreIcoRed { background: linear-gradient(135deg,#ff9eaa,#fb7185); color: #9f1239 } .thMoreIcoMic { background: linear-gradient(135deg,#ffd36e,#ffb347); color: #8a4c00 } .thMoreToggleFlag { display: none!important } .thMoreSwitchUI { width: 46px; height: 28px; border-radius: 999px; background: #e2e8f0; position: relative; flex: 0 0 auto; transition: background .2s; border: 1px solid rgba(15,23,42,.06); box-shadow: none } .thMoreSwitchUI:after { content: ''; position: absolute; top: 3px; right: 3px; width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 1px solid rgba(15,23,42,.08); box-shadow: none; transition: transform .2s,background .2s; margin-top: -2px } #gameinvite .thMoreToggleFlag.fa-ban~.thMoreSwitchUI,#nowalltoggle .thMoreToggleFlag.fa-ban~.thMoreSwitchUI,.thMoreSwitchUI.is-on { background: #45dc57eb } #gameinvite .thMoreToggleFlag.fa-ban~.thMoreSwitchUI:after,#nowalltoggle .thMoreToggleFlag.fa-ban~.thMoreSwitchUI:after,.thMoreSwitchUI.is-on:after { transform: translateX(-18px) } #mute1 .thMoreSwitchUI.is-on { background: #45dc57eb } #mute1 .thMoreSwitchUI.is-on:after { transform: translateX(-18px) } @keyframes gradientMove { 0%,100% { background-position: 0 50% } 50% { background-position: 100% 50% } } #thGames.thGamesIOS { height: 100%; width: 100%; overflow-y: auto; overflow-x: hidden; padding: 14px 10px 20px; border: 0!important; background: radial-gradient(circle at 100% 0,rgba(34,211,238,.36) 0,transparent 42%),radial-gradient(circle at 0 100%,rgba(139,92,246,.3) 0,transparent 44%),radial-gradient(circle at 50% 100%,rgba(236,72,153,.24) 0,transparent 40%),linear-gradient(165deg,#c7f9ff 0,#ddd6fe 48%,#fbcfe8 100%)!important; color: #e2e8f0; font-family: Cairo,'El Messiri',system-ui,sans-serif; -webkit-overflow-scrolling: touch } .thGamesHero { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 2px 6px 14px; padding: 9px 10px; border-radius: 14px; background: linear-gradient(135deg,rgba(52,211,153,.18) 0,rgba(167,139,250,.2) 100%); border: 1px solid rgba(255,255,255,.08) } .thGamesHeroIco { width: 36px; height: 36px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; font-size: 18px; color: #fff; background: linear-gradient(145deg,#34d399 0,#8b5cf6 100%) } .thGamesHeroTxt { font-size: 17px; font-weight: 800; letter-spacing: .2px; color: #5c5c5c } .thGamesSection { margin: 0 4px 10px } .thGamesSectionTitle { margin: 0 8px 8px; font-size: 11px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; color: rgb(79 79 79) } .thGamesCards { display: flex; flex-direction: column; gap: 8px } .thGamesCard { width: 100%; border: 1px solid rgba(139,92,246,.18); border-radius: 14px; display: flex; align-items: center; gap: 10px; padding: 11px 7px; cursor: pointer; position: relative; direction: rtl; text-align: right; background: linear-gradient(135deg,rgba(255,255,255,.74) 0,rgba(245,243,255,.64) 48%,rgba(252,231,243,.52) 100%); color: #312e81; -ms-touch-action: manipulation; touch-action: manipulation; transition: transform .15s,border-color .15s,box-shadow .15s } .thGamesCard:active { transform: scale(.985) } .thGamesCardIco { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; font-size: 17px; color: #fff } .thGamesCardBody { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px } .thGamesCardTitle { font-size: 14px!important; font-weight: 800; color: #000; line-height: 1.25 } .thGamesCardSub { font-size: 12px!important; font-weight: 600; color: rgb(84 84 84); line-height: 1.3 } .thGamesCardGo { flex: 0 0 auto; font-size: 22px; line-height: 1; color: rgba(226,232,240,.45); margin-left: 2px } .thGamesCardLobby { position: relative; padding: 0; min-height: 92px; overflow: hidden; align-items: stretch; background: url('/games/ludoo.jpg') center/cover no-repeat; border-color: rgba(52,211,153,.28) } .thGamesCardLobbyOverlay { position: relative; z-index: 1; display: flex; align-items: flex-start; gap: 8px; width: 100%; padding: 10px 36px 12px 12px; background: linear-gradient(180deg,rgba(0,0,0,.78) 0,rgba(0,0,0,.42) 72%,rgba(0,0,0,.12) 100%) } .thGamesCardLobbyBadge { flex: 0 0 auto; min-width: 34px; padding: 4px 7px; border-radius: 8px; font-size: 12px; font-weight: 800; line-height: 1; text-align: center; color: #ecfdf5; background: linear-gradient(145deg,#10b981 0,#059669 100%); border: 1px solid rgba(255,255,255,.22); box-shadow: 0 2px 8px rgba(0,0,0,.28) } .thGamesCardLobbyTexts { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px } .thGamesCardLobby .thGamesCardSub,.thGamesCardLobby .thGamesCardTitle { color: #fff; text-shadow: 0 1px 6px rgba(0,0,0,.65) } .thGamesCardLobby .thGamesCardGo { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); z-index: 2; margin-left: 0; color: rgba(255,255,255,.88); text-shadow: 0 1px 6px rgba(0,0,0,.55) } .thGamesCardIcoBot { background: linear-gradient(145deg,#f59e0b 0,#d97706 100%) } .thGamesCardBot { border-color: rgba(139,92,246,.2); background: linear-gradient(135deg,rgba(255,255,255,.82) 0,rgba(237,233,254,.66) 48%,rgba(251,207,232,.52) 100%); color: #312e81 } .thGamesCardIcoStarLudo { background: linear-gradient(145deg,#22c55e 0,#16a34a 100%) } .thGamesCardIcoStarXo { background: linear-gradient(145deg,#a855f7 0,#7c3aed 100%) } .thGamesCardStar { padding: 11px 14px; border-color: rgba(139,92,246,.22); backdrop-filter: blur(10px) saturate(1.12); -webkit-backdrop-filter: blur(10px) saturate(1.12); box-shadow: 0 10px 28px rgba(49,46,129,.1),0 2px 6px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.92),inset 0 -1px 0 rgba(139,92,246,.06); overflow: hidden } .thGamesCardStar::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(135deg,rgba(255,255,255,.38) 0,transparent 42%,transparent 68%,rgba(255,255,255,.08) 100%) } .thGamesCardStar .thGamesCardIco { width: 44px; height: 44px; border-radius: 13px; border: 1px solid rgba(255,255,255,.32); box-shadow: 0 6px 16px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.35); position: relative; z-index: 1 } .thGamesCardStar .thGamesCardIcoStarLudo { box-shadow: 0 6px 18px rgba(34,197,94,.38),inset 0 1px 0 rgba(255,255,255,.35) } .thGamesCardStar .thGamesCardIcoStarXo { box-shadow: 0 6px 18px rgba(168,85,247,.38),inset 0 1px 0 rgba(255,255,255,.35) } .thGamesCardStar .thGamesCardBody,.thGamesCardStar .thGamesCardGo { position: relative; z-index: 1 } .thGamesCardStar .thGamesCardTitle { letter-spacing: .2px } .thGamesCardStar .thGamesCardGo { color: rgba(49,46,129,.34); font-size: 24px; font-weight: 300 } @media (hover: hover) { #more.thMoreIOS .thMoreRow:hover { filter:brightness(1.015) } .thGamesCardStar:hover { transform: translateY(-1px); border-color: rgba(139,92,246,.28); box-shadow: 0 14px 34px rgba(49,46,129,.14),0 4px 10px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.95) } } .thGamesCardStar:active { transform: scale(.985) } .thGamesCardIcoMute { background: linear-gradient(145deg,#f43f5e 0,#e11d48 100%) } .thGamesCardToggle { border-color: rgba(236,72,153,.24); background: linear-gradient(135deg,rgba(255,255,255,.84) 0,rgba(252,231,243,.62) 48%,rgba(251,207,232,.5) 100%); color: #831843 } .thGamesToggleFlag { display: none } .thGamesSwitchUI { flex: 0 0 auto; margin-right: 2px } .thGamesDivider { height: 1px; margin: 10px 14px 12px; background: linear-gradient(90deg,transparent 0,rgba(148,163,184,.35) 18%,rgba(148,163,184,.35) 82%,transparent 100%) } #thGames #gameinvite .thMoreToggleFlag.fa-ban~.thGamesSwitchUI,#thGames.thGamesIOS .thGamesToggle .thMoreToggleFlag.fa-ban~.thGamesSwitchUI { background: #34d399 } #thGames #gameinvite .thMoreToggleFlag.fa-ban~.thGamesSwitchUI:after,#thGames.thGamesIOS .thGamesToggle .thMoreToggleFlag.fa-ban~.thGamesSwitchUI:after { transform: translateX(-18px) } .th-settings-games-open-btn { position: relative; isolation: isolate; overflow: hidden; background: 0 0!important; color: #fff!important; padding: 6px 30px!important; border-radius: 10px; font-weight: 700; border: 0!important; margin-bottom: 1px!important; text-shadow: 0 1px 2px rgba(0,0,0,.3); display: block; text-align: center!important; z-index: 0 } .th-settings-games-open-btn::after { content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: linear-gradient(90deg,#ec4899,#a855f7,#6366f1,#f472b6); background-size: 300% 300%; animation: 6s infinite gradientMove; pointer-events: none } .th-settings-games-open-btn::before { content: '\f091'; font-family: FontAwesome; font-weight: 400; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); margin: 0; font-size: 15px; line-height: 1; text-shadow: 0 1px 2px rgba(0,0,0,.25); z-index: 1 } #gridSystemModal .modal-dialog { max-width: 420px!important; margin: 10vh auto!important } #gridSystemModal .modal-content { position: relative; background: rgba(15,22,41,.92)!important; border-radius: 18px!important; border: 1px solid rgba(255,255,255,.06)!important; overflow: hidden } #gridSystemModal .modal-content::before { content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1.6px; background: linear-gradient(135deg,#1b84f2,#10b981,#8b5cf6); -webkit-mask: linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none } #gridSystemModal .modal-content>* { position: relative; z-index: 1 } #gridSystemModal .modal-header { direction: rtl; display: flex!important; align-items: center!important; justify-content: space-between!important; gap: 8px!important; padding: 12px 14px!important; background: var(--bt-primary); border-bottom: 1px solid rgba(255,255,255,.06)!important } #gridSystemModal .modal-header .fl,#gridSystemModal .modal-header .fr { float: none!important } #gridSystemModal .modal-title { color: #e6edf7!important; font-weight: 800!important; font-size: 16px!important; margin: 0!important; text-shadow: 0 1px 0 rgba(0,0,0,.35) } #gridSystemModal .modal-header .btn.btn-primary.fa.fa-close { background: 0 0!important; color: #e6edf7!important; border: 1px solid rgba(255,255,255,.15)!important; width: 32px!important; height: 32px!important; border-radius: 9px!important; display: inline-flex; align-items: center; justify-content: center } #gridSystemModal .modal-header .btn.btn-primary.fa.fa-close:hover { background: #c70000!important; border-color: #c70000!important; color: #fff!important } #gridSystemModal .modal-body { padding: 16px!important; background: #fff } #gridSystemModal .col-xs-12,#gridSystemModal .row { margin: 0!important } #gridSystemModal .img-thumbnail.hand.fitimg.lazyload { border-radius: 12px!important; border: 1px solid rgba(255,255,255,.08)!important; background: #0b1220!important } #gridSystemModal .col-xs-12.bg-primary { background: linear-gradient(135deg,#1b84f2,#3a86ff)!important; border-radius: 10px!important; height: 6px!important } #gridSystemModal .col-xs-12.bg-primary>span { display: none!important } #gridSystemModal .bootTi { color: #a8c5ff!important; font-weight: 800!important; font-size: 14px!important } #gridSystemModal .modal-footer { padding: 10px 14px!important; background: #fff; border-top: 1px solid rgba(255,255,255,.06)!important; display: grid; gap: 8px } #gridSystemModal .modal-footer .btn { width: 100%!important; border-radius: 14px!important; padding: 10px 12px!important; font-weight: 800!important; transition: transform .15s,box-shadow .15s,opacity .2s; border: 0!important } #gridSystemModal .modal-footer .btn.btn-primary { background: linear-gradient(135deg,#00b894,#00d1b2)!important } #gridSystemModal .modal-footer .btn.btn-danger { background: linear-gradient(135deg,#f43f5e,#fb7185)!important } #gridSystemModal .modal-footer .btn:hover { transform: translateY(-1px); box-shadow: 0 14px 24px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.1) } #gridSystemModal .modal-footer .btn:active { transform: translateY(0) } .x-a-d8738d { background-image: url(/im2/1.png) } .x-a-83e1b4 { background-image: url(/im2/2.png) } .x-a-f24c63 { background-image: url(/im2/3.png) } .x-a-c0d3c6 { background-image: url(/im2/4.png) } .x-a-77a45c { background-image: url(/im2/6.png) } .x-a-ddd3c9 { background-image: url(/im2/7.png) } .x-a-d83fea { background-image: url(/im2/8.png) } .x-a-c15395 { background-image: url(/im2/9.png) } .x-a-aa8aa0 { background-image: url(/im2/11.png) } .x-a-abf183 { background-image: url(/im2/16.png) } .x-a-4c2baf { background-image: url(/im2/27.png) } .x-a-5e08e5 { background-image: url(/im2/29.png) } .x-a-aac48c { background-image: url(/im2/30.png) } .x-a-42ef37 { background-image: url(/im2/31.png) } .x-a-b77f01 { background-image: url(/im2/32.png) } .x-a-178530 { background-image: url(/im2/34.png) } .x-a-772c98 { background-image: url(/im2/35.png) } .x-a-bf2eeb { background-image: url(/im2/38.png) } .x-a-4eaaeb { background-image: url(/im2/46.png) } .x-g-adc689 { background-image: url(/im3/1.png) } .x-g-ace4d0 { background-image: url(/im3/4.png) } .x-g-5dff9a { background-image: url(/im3/5.png) } .x-a-db6320 { background-image: url(/im3/6.png) } .x-a-a35a76 { background-image: url(/im3/8.png) } .x-a-5393a9 { background-image: url(/im3/12.png) } .x-a-1c571f { background-image: url(/im3/13.png) } .x-a-39c896 { background-image: url(/im3/14.gif) } .x-a-b66c7f { background-image: url(/im3/15.gif) } .x-a-5e3c10 { background-image: url(/im3/18.gif) } .x-a-b971e3 { background-image: url(/im3/19.png) } .x-a-68af56 { background-image: url(/im3/21.png) } .x-a-d44c1b { background-image: url(/im3/26.png) } .x-a-533597 { background-image: url(/im3/28.png) } .x-a-df5abb { background-image: url(/im3/30.png) } .x-a-f6de0c { background-image: url(/im3/33.gif) } .x-a-a88b78 { background-image: url(/im3/38.png) } .x-a-93a0a0 { background-image: url(/im3/43.gif) } .x-a-095e67 { background-image: url(/im3/45.png) } .x-a-522280 { background-image: url(/im3/51.gif) } .x-a-141f16 { background-image: url(/im3/53.gif) } .x-a-38bed8 { background-image: url(/im3/55.gif) } .x-a-0a5099 { background-image: url(/im3/57.gif) } .x-a-091c4b { background-image: url(/im3/58.gif) } .x-a-f78997 { background-image: url(/im3/61.gif) } .x-g-00f5c6 { background-image: url(/im2/no.png) } .x-g-f71cd7 { background-image: url(/im3/file.png); background-size: 100% 100%!important; width: 175px!important } .x-a-867f99 { width: 73px; height: 76px; margin-left: -1px; border: 2px solid; margin-top: -5px } .x-a-c12583 { text-align: center; font-size: 23px!important } .x-a-2bc30f { border: 2px solid #000; width: 72%; height: 76px; margin-left: 5px; margin-bottom: 5px } @media (min-width: 481px) { .movon-card { width:32vw!important; height: 25vw!important; border-radius: 0!important } } @media (max-width: 480px) { .movon-card { width:90vw!important; height: 100vw!important; border-radius: 0!important } } .story-avatar { position: absolute; top: 2px; left: 4px; width: 24px; height: 24px; border-radius: 50%; background: center/cover no-repeat #ddd; border: 2px solid #fff; box-shadow: 0 2px 6px rgba(0,0,0,.25); z-index: 2 } .story-progress { position: absolute; top: 8px; left: 8px; right: 8px; height: 3px; display: flex; gap: 4px; z-index: 10 } .story-progress .sp-bar { flex: 1 1 auto; background: rgba(255,255,255,.35); border-radius: 2px; overflow: hidden } .story-progress .sp-fill { width: 0%; height: 100%; background: #fff; transition: width .2s linear } .story-progress .sp-bar.done .sp-fill { width: 100% } :root { --card-bg: #fff; --card-border: #ececf2; --card-radius: 14px; --card-shadow: 0 6px 18px rgba(0, 0, 0, 0.06); --text-main: #111322; --text-muted: #6b7280; --accent: #2563eb; --chip-bg: #f3f4f6; --chip-text: #111322; --msg-bg: #f8fafc; --msg-text: #0f172a; --btn-like: #ef4444; --btn-comm: #2563eb; --btn-icon: #334155 } #d2>.uzr.d-flex.pmsgcx2.mm,#d2>.uzr.d-flex.pmsgcxx.mm { background: var(--card-bg)!important; border: 1px solid var(--card-border)!important; border-radius: var(--card-radius) !important!important; box-shadow: var(--card-shadow)!important; padding: 10px 12px!important; margin: 8px 6px!important; height: auto!important; align-items: center; gap: 10px; transition: transform .18s,box-shadow .18s,border-color .18s } #d2>.uzr.d-flex.pmsgcx2.mm:hover,#d2>.uzr.d-flex.pmsgcxx.mm:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(0,0,0,.08)!important; border-color: rgba(37,99,235,.25)!important } .th-bc-msg-body > *:not(.emoi):not(.fitsticker) { max-width: 240px!important; max-height: 200px!important; cursor: zoom-in; } #d2>.uzr.d-flex.pmsgcx2.mm>.u-pic,#d2>.uzr.d-flex.pmsgcxx.mm>.u-pic { width: 52px!important; height: 52px!important; min-width: 52px!important; max-height: 52px!important; border-radius: 50%!important; object-fit: cover; outline: #fff2 solid 2px!important; box-shadow: inset 0 0 0 1px var(--card-border),0 2px 8px rgba(0,0,0,.07) } #d2>.uzr.d-flex.pmsgcx2.mm>.uzr.flex-fill.break,#d2>.uzr.d-flex.pmsgcxx.mm>.uzr.flex-fill.break { overflow: hidden!important; padding: 2px 2px 0!important } #d2 .pmsgcx2 .d-flex:first-of-type,#d2 .pmsgcxx .d-flex:first-of-type { height: 22px!important; align-items: center } #d2 .pmsgcx2 .u-topic,#d2 .pmsgcxx .u-topic { max-width: 60%; font-family: Cairo,'El Messiri',system-ui,-apple-system,Segoe UI,Arial,sans-serif; font-weight: 700; font-size: 13px; line-height: 1; color: var(--chip-text)!important; background: var(--chip-bg)!important; border-radius: 6px!important; padding: 4px 8px!important; margin-inline-start:4px!important;white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: default } #d2 .pmsgcx2 .tago,#d2 .pmsgcxx .tago { font-size: 12px!important; color: var(--text-muted)!important; padding-inline:4px!important} #d2>.uzr.d-flex.mm,#wall .uzr.d-flex.mm,.bgg .uzr.d-flex.mm { position: relative; z-index: 0 } #d2>.uzr.d-flex.mm>.tago,#wall .uzr.d-flex.mm>.tago,.bgg .uzr.d-flex.mm>.tago { position: absolute; top: 0; right: 0 } #d2>.uzr.d-flex.mm>.btn-like.fr,#d2>.uzr.d-flex.mm>.fa-reply.fr,#d2>.uzr.d-flex.mm>.fa-times.fr,.bgg .uzr.d-flex.mm>.fa-reply.fr,.bgg .uzr.d-flex.mm>.fa-times.fr,.bgg .uzr.d-flex.mm>.thPmReplyBtn { margin-top: 21px!important; margin-bottom: 0!important } #d2 .pmsgcx2 .u-msg.break,#d2 .pmsgcxx .u-msg.break { width: 100%!important; display: flex!important; align-items: center; gap: 8px; padding: 8px 10px!important; margin-top: 6px; border-radius: 10px; background: var(--msg-bg)!important; color: var(--msg-text)!important; font-family: Cairo,'El Messiri',system-ui,-apple-system,Segoe UI,Arial,sans-serif!important; font-size: 14px!important; font-weight: 500!important } #d2 .pmsgcx2 .u-msg.break .fa-trash,#d2 .pmsgcxx .u-msg.break .fa-history { margin-top: 0!important; margin-inline-start:auto!important;color: var(--accent)!important; font-size: 13px!important; opacity: .9 } .fa-history::before { content: '\f1da' } #d2>div.uzr.d-flex.pmsgcx2.mm,#d2>div.uzr.d-flex.pmsgcxx.mm { background-image: none!important } #d2>div.uzr.d-flex.pmsgcx2>div.uzr.flex-fill.break>div.u-msg.break,#d2>div.uzr.d-flex.pmsgcxx>div.uzr.flex-fill.break>div.u-msg.break { text-align: start!important; display: flex!important; color: var(--msg-text)!important; font-weight: 500!important } #d2>div.uzr.d-flex.Welcome_user.mm>div>div.d-flex,.Welcome_user .fitimg.u-pic { display: none!important } .Welcome_user .welcome-compact { direction: rtl; display: inline-flex; align-items: center; gap: 10px; border-radius: 10px; padding: 8px 10px; max-width: 320px; font-family: Cairo,'Segoe UI',Tahoma,Arial,sans-serif; color: #0f172a; font-size: 13px!important; line-height: 1.1!important; width: 100%; justify-content: flex-start } .Welcome_user .welcome-compact::before { content: ''; display: block; width: 4px; height: 48%; border-radius: 4px; background: linear-gradient(180deg,#38bdf8,#0ea5e9); margin-inline-start:6px} .Welcome_user .welcome-compact .w-ava { width: 42px; height: 42px; min-width: 42px; border-radius: 8px; object-fit: cover; box-shadow: 0 4px 10px rgba(12,18,29,.06); border: 1px solid rgba(16,24,40,.04) } .Welcome_user .welcome-compact .w-body { display: flex; flex-direction: column; gap: 2px; overflow: hidden } .Welcome_user .welcome-compact .w-title { font-weight: 700; color: #d839cf; font-size: 13px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden } .Welcome_user .welcome-compact .w-username { font-weight: 600; color: #0b2540; margin-inline-start:6px} .Welcome_user .welcome-compact .w-sub { font-weight: 500!important; color: #9995e5; font-size: 12px!important; white-space: nowrap; text-overflow: ellipsis; overflow: hidden } .Welcome_user .welcome-compact:hover { transform: translateY(-2px); transition: transform .16s,box-shadow .16s; box-shadow: 0 12px 30px rgba(8,15,30,.06) } @media (prefers-color-scheme: dark) { .Welcome_user .welcome-compact { background:linear-gradient(180deg,rgba(10,14,20,.6),rgba(8,12,18,.6)); border: 1px solid rgba(255,255,255,.04); color: #e6eef8; box-shadow: 0 10px 28px rgba(0,0,0,.45) } .Welcome_user .welcome-compact::before { background: linear-gradient(180deg,#60a5fa,#38bdf8) } .Welcome_user .welcome-compact .w-sub { color: #a7b5c8 } .Welcome_user .welcome-compact .w-title { color: #eef6ff } .Welcome_user .welcome-compact .w-ava { border: 1px solid rgba(255,255,255,.04) } } #d2 .like-count { font-size: 11px!important } .profile-card-modern { width: 100%; max-width: 380px; border-radius: 16px; font-family: 'Segoe UI',Tahoma,sans-serif; color: #333; transition: transform .3s,box-shadow .3s; margin-top: 10px; margin-bottom: -12px } .thProfileShieldCol { display: flex; flex-direction: column; align-items: stretch; gap: 4px; width: 100% } .thProfileShieldTop { display: flex; align-items: center; justify-content: flex-start; gap: 4px; width: 100%; min-width: 0 } .thProfileShieldStatsRow { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-width: 0; direction: ltr; padding: 0 2px 2px } .thProfileShieldStatsRow .thProfilePoints,.thProfileShieldStatsRow:not(:has(.thProfileViews)) .thProfilePoints { margin-left: auto } .thProfilePoints .thProfilePointsIcon { position: relative; z-index: 1; font-size: 11px!important; font-weight: 400!important; color: #c57fcc!important; margin: 0 3px 0 0!important } .thProfilePointsShine { background: linear-gradient(145deg,rgba(255,252,246,.96) 0,rgba(247,240,226,.9) 48%,rgba(255,255,255,.82) 100%); border-color: rgba(186,152,72,.22) } .thProfilePointsNum { position: relative; z-index: 1; font-family: -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; font-size: 11px!important; font-weight: 600; color: #5e440b!important; letter-spacing: .02em; line-height: 1.1; font-variant-numeric: tabular-nums } .thProfileShieldRow { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(210,210,210,.55); margin-top: 0; margin-bottom: 0; padding-bottom: 2px } .thProfileShieldStats { flex: 0 0 auto; flex-direction: column; align-items: flex-end; justify-content: center; gap: 5px; margin: 0; padding: 0; border-bottom: 0 } .thProfileShieldStats .thProfileHeaderEnd,.thProfileShieldStats .thProfileHeaderStart { flex: 0 0 auto; width: auto } .header-info { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 6px; margin-top: 4px; padding-bottom: 6px } .thProfileHeaderEnd,.thProfileHeaderStart { flex: 0 0 auto; min-width: 0 } .thProfileHeaderSpacer { width: 0; min-width: 0; flex: 1 1 0 } .thProfileHeaderCenter { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; margin: 0; padding: 0; border: 0; background: 0 0 } .thProfileHeaderStart:not(.thProfileHeaderSpacer) { flex: 1 1 0 } .thProfileHeaderEnd { flex: 1 1 0; display: flex; justify-content: flex-end } .header-info:not(:has(.thProfileViews)) .thProfileHeaderSpacer { flex: 1 1 0 } .thProfileStat { display: flex; align-items: center; margin: 0; padding: 0; border: 0; background: 0 0; min-width: 0; flex-shrink: 0 } .thProfileStatShine { position: relative; display: inline-flex; align-items: center; gap: 5px; padding: 3px 11px; border-radius: 999px; background: linear-gradient(145deg,rgba(255,252,246,.96) 0,rgb(246 79 250 / 25%) 48%,rgba(255,255,255,.82) 100%); box-shadow: 0 1px 2px rgba(96,78,36,.07),inset 0 1px 0 rgba(255,255,255,.72); letter-spacing: .03em; overflow: hidden; white-space: nowrap; line-height: 1.15!important; -webkit-font-smoothing: antialiased } .thProfileViews .thProfileStatShine { background: linear-gradient(145deg,rgba(248,251,255,.97) 0,rgba(230,240,250,.92) 52%,rgba(255,255,255,.86) 100%); border-color: rgba(91,141,182,.28); box-shadow: 0 1px 2px rgba(45,88,128,.08),inset 0 1px 0 rgba(255,255,255,.8) } .thProfileStatShine::after { display: none } .thProfileViews .thProfileEye { position: relative; z-index: 1; font-size: 11px!important; font-weight: 400!important; color: #4f86b5!important; margin: 0 3px 0 0!important } .thProfileLevelInner,.thProfileStatShine .NUMBER_TH,.thProfileStatShine .thUserLevelLv,.thProfileStatShine .thUserLevelPts,.thProfileStatShine .thUserLevelSep { position: relative; z-index: 1; font-family: inherit } .thProfileStatShine .thUserLevelLv { font-size: 11px!important; font-weight: 600; color: #b8892a!important; letter-spacing: .07em; line-height: 1.1 } .thProfileStatShine .thUserLevelSep { display: inline-block; width: 3px; height: 3px; margin: 0 1px; padding: 0; border-radius: 50%; background: linear-gradient(135deg,#d8b45a 0,#a67c1d 100%); opacity: .72; font-size: 0!important; line-height: 0; overflow: hidden; color: transparent!important } .thProfileStatShine .thUserLevelPts { font-size: 11px!important; font-weight: 500; color: #9a7d42!important; letter-spacing: .02em; line-height: 1.1 } .thProfileViews .NUMBER_TH { font-size: 11px!important; font-weight: 600; color: #356789!important; letter-spacing: .03em; line-height: 1.1 } .thProfileLevelInner { display: inline-flex; align-items: center; gap: 6px } .thProfileLevel .thProfileLevelShine { min-height: auto } .info-block { display: flex; align-items: center; font-size: .9rem; color: #555 } .info-block i { margin-right: 5px; font-size: 1.1rem } .checked { color: #f1c40f } .stars-users { display: flex; gap: 4px; align-items: center; justify-content: center } #upro .thProfileStars { display: none!important } #upro .thProfileStars .fa.fa-star { font-size: 13px!important; font-weight: 300!important; color: rgba(180,180,180,.45)!important; line-height: 1; margin: 0; text-shadow: none!important; filter: none!important; animation: none!important } #upro .thProfileStars .fa.fa-star.checked { color: #f5a623!important; font-weight: 400!important; text-shadow: none!important; filter: none!important; animation: none!important } .games-duo-modern { display: flex; gap: 12px } .game-btn { flex: 1; position: relative; padding: 6px 14px 5px 40px; background: #f5f5f845; border: 1px solid #dcdce0; border-radius: 12px; font-size: .95rem; color: #333; cursor: pointer; overflow: hidden; transition: background .3s,border-color .3s } .game-btn::before { content: ''; position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 22px; height: 22px; background-image: var(--icon-url); background-size: cover; background-position: center } .game-btn:hover { background: #eaeaf0; border-color: #c0c0c8 } .info-block.views { display: flex; align-items: center; gap: 6px; border-radius: 14px; padding: 6px 12px; font-size: .95rem; color: #333 } .info-block.views:hover { background: rgba(240,240,240,.85); box-shadow: 0 4px 12px rgba(0,0,0,.04) } .info-block.views .fa-eye { font-size: 1.1rem; color: #3f51b5; transition: color .3s,transform .3s; font-weight: 300!important } .info-block.views:hover .fa-eye { color: #3b3f42; transform: scale(1.05) } .info-block.views .NUMBER_TH { font-weight: 500; color: #1e1e1e; letter-spacing: .3px; transition: color .3s } .info-block.views:hover .NUMBER_TH { color: #000 } .info-block.rating { display: flex; align-items: center; gap: 6px; border-radius: 14px; padding: 6px 12px; font-size: .95rem; color: #333 } .info-block.rating:hover { background: rgba(255,245,225,.85); box-shadow: 0 4px 12px rgba(0,0,0,.04) } .info-block.rating .fa-star { font-size: 1.1rem; color: #f5b70a; transition: color .3s,transform .3s } .info-block.rating:hover .fa-star { color: #e8a800; transform: scale(1.05) } .info-block.rating .pointtop { font-weight: 500; color: #1e1e1e; letter-spacing: .3px; transition: color .3s } .info-block.rating:hover .pointtop { color: #000 } body>div.ppop.light.border.break.ppop-color-container { margin-left: -73px; margin-top: 1px } #lonline .u-msg,#users .u-msg,.nosel,.profile-name,.tago,.u-topic { -webkit-touch-callout: none!important; -webkit-user-select: none!important; -khtml-user-select: none!important; -moz-user-select: none!important; -ms-user-select: none!important; user-select: none!important; cursor: default!important } #users>div>div>div.d-flex.fl>div>div.d-flex.dots>div { display: flex; justify-content: space-between } body>div.center-block.bg.dad>div>div.break.fl>img { width: auto; max-width: 100px } .rank-bades .th-rank-badge-dim { opacity: .8 } .rank-bades .th-rank-badge-locked { filter: grayscale(1) brightness(.9) contrast(.82); opacity: .34 } .rank-bades .th-rank-badge { width: 62px; height: 66px; flex: 0 0 auto; display: inline-block } .kb-open .filter_notf { display: none!important } #lonline>div>div.d-flex.fl>div>div.new-stars_users_uhtml,#tlogins .new-stars_users_uhtml { --shine-inset: -4%; --star-gap: 3px; gap: var(--star-gap) } #story .str { display: flex; align-items: center; justify-content: center; width: 57px!important; position: relative; margin-top: 4px!important; margin-bottom: 5px } #TH_PM_EMPTY.thPmEmpty { height: 81%; width: 100%; display: flex; align-items: center; justify-content: center; padding: 18px; background: 0 0 } #TH_PM_EMPTY .thPmEmptyCenter { width: 100%; max-width: 520px; text-align: center; padding: 34px 18px 0 } #TH_PM_EMPTY .thPmEmptyIcon { width: 220px; height: 220px; margin: 0 auto 18px; border-radius: 999px; background: rgba(17,24,39,.06); position: relative; display: flex; align-items: center; justify-content: center } #TH_PM_EMPTY .thPmEmptyIcon:before { content: ""; width: 118px; height: 118px; border-radius: 26px; background: var(--bg-primary); box-shadow: 0 10px 18px rgba(17,24,39,.1); display: block } #TH_PM_EMPTY .thPmEmptyIcon:after { content: ""; position: absolute; width: 66px; height: 34px; top: 50%; left: 50%; transform: translate(-50%,-60%); border-radius: 10px; background: linear-gradient(rgba(255,255,255,.55),rgba(255,255,255,.55)) 0 0/100% 8px no-repeat,linear-gradient(rgba(255,255,255,.35),rgba(255,255,255,.35)) 0 18px/80% 8px no-repeat; opacity: .95 } #TH_PM_EMPTY .thPmEmptyTitle { color: #111827; margin: 0 0 8px } #TH_PM_EMPTY .thPmEmptySub { font-size: 16px; font-weight: 800; color: rgba(17,24,39,.55); margin: 0 } #TH_TOP_V3.thMoreSubPane,#TH_WALL_TREND_V3,#borderbackground.thMoreSubPane,#notification.thMoreSubPane,#thWallTrend.thMoreSubPane { position: relative; padding-top: 28px; box-sizing: border-box; background: radial-gradient(circle at 100% 0,rgba(244,114,182,.06) 0,transparent 38%),radial-gradient(circle at 0 100%,rgba(167,139,250,.05) 0,transparent 40%),linear-gradient(180deg,#fffafb 0,#f8fafc 100%)!important } #borderbackground.thMoreSubPane { position: relative; padding: 42px 10px 18px; box-sizing: border-box; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; direction: rtl; text-align: right; border: 0!important; background: radial-gradient(circle at 100% 0,rgba(244,114,182,.06) 0,transparent 38%),radial-gradient(circle at 0 100%,rgba(167,139,250,.05) 0,transparent 40%),linear-gradient(180deg,#fffafb 0,#f8fafc 100%)!important } #borderbackground h5 { text-align: center!important; font-size: 14px!important; font-weight: 800!important; line-height: 1.35; margin: 16px 6px 10px!important; padding: 9px 12px; border-radius: 12px; color: #9d174d; font-family: 'El Messiri',Cairo,sans-serif!important; background: linear-gradient(135deg,rgba(255,255,255,.96) 0,rgba(255,241,248,.88) 100%); border: 1px solid rgba(244,114,182,.14); box-shadow: none } #borderbackground h5:first-of-type { margin-top: 6px!important } #borderbackground .VBORB.dslita { display: grid; grid-template-columns: repeat(auto-fill,minmax(76px,1fr)); gap: 2px; justify-content: center; padding: 0; margin: 0 12px 12px; border-radius: 16px; background: linear-gradient(135deg,#fff 0,#fff1f8 100%); border: 1px solid rgba(244,114,182,.14); box-shadow: none } #borderbackground .VBORB.dslita div { margin: 0!important; width: 100%!important; height: auto; min-height: 76px; aspect-ratio: 1; border: 1px solid rgba(244,114,182,.18)!important; border-radius: 14px; background-size: cover; background-position: center; background-repeat: no-repeat; display: block; cursor: pointer; box-shadow: none; -ms-touch-action: manipulation; touch-action: manipulation; transition: transform .12s,filter .12s,border-color .12s } #borderbackground .VBORB.dslita div:active { transform: scale(.96); filter: brightness(.97) } #borderbackground .VBORB.dslita .x-g-f71cd7 { aspect-ratio: auto; min-height: 76px; background-size: 100% 100%!important; display: flex } #borderbackground .VBOR.dslists { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; padding: 12px; margin: 0 4px 10px; border-radius: 16px; background: linear-gradient(135deg,#fff 0,#fdf2f8 100%); border: 1px solid rgba(244,114,182,.14); box-shadow: none } #borderbackground .VBOR.dslists div { width: 100%!important; height: 60px; margin: 0!important; border: 1px solid rgba(244,114,182,.16)!important; border-radius: 12px; background-size: 100% 100%; background-position: center; background-repeat: no-repeat; cursor: pointer; box-shadow: none; -ms-touch-action: manipulation; touch-action: manipulation; transition: transform .12s,filter .12s } #borderbackground .VBOR.dslists div:active { transform: scale(.98); filter: brightness(.97) } #borderbackground .VBOR.dslists img { width: 100%!important; height: 72px; margin: 0!important; border: 1px solid rgba(244,114,182,.16)!important; border-radius: 12px; cursor: pointer; box-shadow: none; -ms-touch-action: manipulation; touch-action: manipulation; transition: transform .12s,filter .12s } #borderbackground .VBOR.dslists img:active { transform: scale(.98); filter: brightness(.97) } #borderbackground .VBOR.dslists .x-a-2bc30f { grid-column: 1/-1; width: 100%!important; height: 76px!important; margin-left: 0!important; margin-bottom: 0!important } #borderbackground .VBOR.dslists .x-a-867f99 { width: 100%!important; height: 60px!important; margin-left: 0!important; margin-top: 0!important } @media (max-width: 360px) { #borderbackground .VBORB.dslita { grid-template-columns:repeat(3,minmax(0,1fr)); gap: 8px; padding: 10px } #borderbackground .VBOR.dslists { grid-template-columns: 1fr } } .thWallTrendWrap { direction: rtl; text-align: right } #TH_WALL_TREND_V3 .thWallTrendWrap,#thWallTrend .thWallTrendWrap { padding: 0; height: calc(100% - 42px) } .thWallTrendSection { margin-bottom: 10px; padding: 8px; border: 1px solid #dde8ed; border-radius: 8px; background: #fff } .thWallTrendTitle { color: #17465b; font-size: 12px; font-weight: 800; margin-bottom: 6px } .thWallTrendRow { display: flex; align-items: center; gap: 8px; padding: 5px 0 } .thWallTrendRow+.thWallTrendRow { border-top: 1px solid #eef3f6 } .thWallTrendAvatar { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; flex: 0 0 28px; border: 1px solid #dde8ed; background: #f3f6f8 } .thWallTrendMeta { min-width: 0; flex: 1 } .thWallTrendName { color: #20313d; font-size: 12px; font-weight: 700; line-height: 1.3; word-break: break-word } .thWallTrendCount { color: #667985; font-size: 11px; font-weight: 700; margin-top: 1px } .thWallTrendEmpty { color: #8a9aa6; font-size: 11px; padding: 2px 0 } .th-wall-trend-lux { display: flex; flex-direction: column; height: 100%; min-height: 0 } .th-wall-trend-hero { flex: 0 0 auto; padding: 12px 12px 10px; background: radial-gradient(circle at 92% 8%,rgba(251,191,36,.1) 0,transparent 42%),radial-gradient(circle at 8% 92%,rgba(147,197,253,.1) 0,transparent 40%),linear-gradient(180deg,#fffefb 0,#f8fafc 58%,#f1f5f9 100%); border-bottom: 1px solid rgba(226,232,240,.92); box-shadow: 0 4px 14px rgba(148,163,184,.07) } .th-wall-trend-hero-title { color: #475569; font-size: 13px!important; font-weight: 800!important; text-align: center; margin-bottom: 8px; letter-spacing: .15px; text-shadow: none } .th-wall-trend-hero .thWallTrendTabs { margin-bottom: 0 } .th-wall-trend-hero .thMicTrendTab { background: #f8fafc; border-color: #e2e8f0; color: #64748b } .th-wall-trend-hero .thMicTrendTab.is-active { background: linear-gradient(135deg,#fef3c7,#fde68a); border-color: #fcd34d; color: #92400e; box-shadow: 0 3px 10px rgba(251,191,36,.14) } .thWallTrendBody { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; align-content: flex-start; gap: 8px; padding: 8px 8px 12px; background: linear-gradient(180deg,#f8fafc 0,#fff 100%); -webkit-overflow-scrolling: touch } .th-wall-trend-card { --wt-accent: #fcd34d; --wt-accent-2: #fbbf24; --wt-accent-3: #fde68a; --wt-surface: linear-gradient(135deg, rgba(255, 255, 255, .98) 0%, rgba(255, 251, 235, .82) 100%); --wt-border: rgba(251, 191, 36, .16); --wt-glow: rgba(251, 191, 36, .08); --wt-title-color: #a16207; --wt-score-color: #ca8a04; --wt-score-bg: linear-gradient(135deg, rgba(254, 243, 199, .5), rgba(253, 230, 138, .34)); --wt-name-color: #78716c; --wt-row-1-bg: linear-gradient(90deg, rgba(255, 255, 255, .98) 0%, rgba(254, 243, 199, .42) 100%); position: relative; padding: 10px 10px 8px; border-radius: 16px; border: 1px solid var(--wt-border); background: var(--wt-surface); box-shadow: 0 3px 12px var(--wt-glow); flex: 0 0 auto; height: auto; min-height: 0; overflow: visible } .th-wall-trend-card::before { content: ''; position: absolute; inset: 0 auto auto 0; width: 100%; height: 2px; background: linear-gradient(90deg,var(--wt-accent-3),var(--wt-accent),var(--wt-accent-2)); opacity: .55 } .th-wall-trend-card--posts { --wt-accent: #fcd34d; --wt-accent-2: #fbbf24; --wt-accent-3: #fde68a; --wt-surface: linear-gradient(135deg, #ffffff 0%, #fffbeb 100%); --wt-border: rgba(251, 191, 36, .16); --wt-glow: rgba(251, 191, 36, .08); --wt-title-color: #a16207; --wt-score-color: #ca8a04; --wt-score-bg: linear-gradient(135deg, rgba(254, 243, 199, .5), rgba(253, 230, 138, .34)); --wt-name-color: #78716c; --wt-row-1-bg: linear-gradient(90deg, #ffffff 0%, #fef3c7 100%) } .th-wall-trend-card--chat { --wt-accent: #67e8f9; --wt-accent-2: #22d3ee; --wt-accent-3: #a5f3fc; --wt-surface: linear-gradient(135deg, #ffffff 0%, #ecfeff 100%); --wt-border: rgba(34, 211, 238, .16); --wt-glow: rgba(34, 211, 238, .08); --wt-title-color: #0e7490; --wt-score-color: #0891b2; --wt-score-bg: linear-gradient(135deg, rgba(207, 250, 254, .52), rgba(165, 243, 252, .34)); --wt-name-color: #64748b; --wt-row-1-bg: linear-gradient(90deg, #ffffff 0%, #cffafe 100%) } .th-wall-trend-card--likes { --wt-accent: #fda4af; --wt-accent-2: #fb7185; --wt-accent-3: #fecdd3; --wt-surface: linear-gradient(135deg, #ffffff 0%, #fff1f2 100%); --wt-border: rgba(251, 113, 133, .16); --wt-glow: rgba(251, 113, 133, .08); --wt-title-color: #be123c; --wt-score-color: #e11d48; --wt-score-bg: linear-gradient(135deg, rgba(254, 205, 211, .5), rgba(254, 226, 226, .34)); --wt-name-color: #64748b; --wt-row-1-bg: linear-gradient(90deg, #ffffff 0%, #ffe4e6 100%) } .th-wall-trend-card--comments { --wt-accent: #c4b5fd; --wt-accent-2: #a78bfa; --wt-accent-3: #ddd6fe; --wt-surface: linear-gradient(135deg, #ffffff 0%, #f5f3ff 100%); --wt-border: rgba(167, 139, 250, .16); --wt-glow: rgba(167, 139, 250, .08); --wt-title-color: #7c3aed; --wt-score-color: #8b5cf6; --wt-score-bg: linear-gradient(135deg, rgba(237, 233, 254, .52), rgba(221, 214, 254, .34)); --wt-name-color: #64748b; --wt-row-1-bg: linear-gradient(90deg, #ffffff 0%, #ede9fe 100%) } .th-wall-trend-card-head { display: flex; align-items: center; gap: 7px; margin-bottom: 7px; padding-bottom: 6px; border-bottom: 1px solid rgba(226,232,240,.75) } .th-wall-trend-card-icon { flex: 0 0 auto; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; font-size: 15px; border-radius: 10px; background: linear-gradient(145deg,var(--wt-accent-3),var(--wt-accent)); box-shadow: 0 2px 8px var(--wt-glow) } .th-wall-trend-card-title { flex: 1 1 auto; min-width: 0; font-size: 11px!important; font-weight: 800!important; line-height: 1.35!important; color: var(--wt-title-color) } .th-wall-trend-rank-list { display: flex; flex-direction: column; gap: 6px; flex: 0 0 auto; overflow: visible } .th-wall-trend-rank-row { display: flex; align-items: center; gap: 8px; padding: 7px 8px; min-height: 50px; direction: ltr; border-radius: 12px; background: rgba(255,255,255,.88); border: 1px solid rgba(226,232,240,.85); box-shadow: 0 1px 6px rgba(148,163,184,.05) } .th-wall-trend-rank-row.rank-1 { background: var(--wt-row-1-bg); border-color: var(--wt-border); box-shadow: 0 2px 8px var(--wt-glow) } .th-wall-trend-rank-row.rank-2 { border-color: rgba(226,232,240,.95) } .th-wall-trend-rank-row.rank-3 { border-color: rgba(241,245,249,.98) } .th-wall-trend-rank-badge { flex: 0 0 auto; width: 26px; text-align: center; font-size: 14px; line-height: 1 } .th-wall-trend-rank-avatar-wrap { flex: 0 0 auto; padding: 2px; border-radius: 50%; background: linear-gradient(145deg,var(--wt-accent-3),var(--wt-accent)) } .th-wall-trend-rank-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; display: block; border: 2px solid #fff; background-color: #f8fafc; background-size: 100% 100%; background-repeat: no-repeat; background-position: center center } .th-wall-trend-rank-row.rank-1 .th-wall-trend-rank-avatar { box-shadow: 0 0 0 2px var(--wt-border) } .th-wall-trend-rank-name { flex: 1 1 auto; min-width: 0; font-size: 12px!important; font-weight: 700!important; color: var(--wt-name-color); line-height: 1.3!important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; direction: rtl; text-align: left } .th-wall-trend-rank-score { flex: 0 0 auto; font-size: 11px!important; font-weight: 700!important; color: var(--wt-score-color); background: var(--wt-score-bg); border: 1px solid var(--wt-border); border-radius: 999px; padding: 3px 8px; line-height: 1.2!important; white-space: nowrap } .th-wall-trend-card-empty,.th-wall-trend-loading { text-align: center; padding: 14px 8px; color: #94a3b8; font-size: 11px; font-weight: 700 } @media (max-width: 480px) { .thWallTrendBody { gap:6px; padding: 6px 6px 10px } .th-wall-trend-card { padding: 8px 8px 7px; border-radius: 14px } .th-wall-trend-rank-row { gap: 6px; padding: 6px 7px; min-height: 46px } .th-wall-trend-rank-avatar { width: 32px; height: 32px } .th-wall-trend-rank-name { font-size: 11px!important } .th-wall-trend-rank-score { font-size: 10px!important; padding: 2px 7px } } .thMicTrendSection { background: linear-gradient(135deg,#eef8b0 0,#f8fbfc 100%); border-color: rgba(180,200,50,.22) } .thLudoTrendWrap,.thMicTrendWrap,.thXoTrendWrap { padding: 8px 10px 14px; direction: rtl; text-align: right } .thMicTrendPage { padding: 4px 2px 10px } .thMicTrendPageHead { text-align: center; margin-bottom: 14px } .thMicTrendTabs { display: flex; gap: 8px; justify-content: center; margin: 0 0 14px; padding: 0 8px } .thMicTrendTab { flex: 1; max-width: 110px; border: 1px solid rgba(15,23,42,.12); background: #fff; color: #334155; border-radius: 999px; padding: 8px 10px; font-size: 13px; font-weight: 800; cursor: pointer } .thMicTrendTab.is-active { background: #0ea5e9; border-color: #0ea5e9; color: #fff } .thMicTrendDivider { margin: 18px 10px 14px; border-top: 2px solid rgba(15,23,42,.12) } .thMicTrendRestList { display: flex; flex-direction: column; gap: 10px; padding: 0 8px 8px } .thMicTrendListItem { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 14px; background: rgba(255,255,255,.92); border: 1px solid rgba(15,23,42,.08) } .thMicTrendListRank { min-width: 22px; color: #17465b; font-size: 14px; font-weight: 900; text-align: center } .thMicTrendListAvatar { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; flex-shrink: 0; background-size: 100% 100%; background-repeat: no-repeat; background-position: center center } .thMicTrendListName { flex: 1; color: #20313d; font-size: 13px; font-weight: 800; line-height: 1.35; word-break: break-word } .thMicTrendListDuration { color: #667985; font-size: 11px; font-weight: 700; white-space: nowrap } .thMicTrendPageTitle { color: #17465b; font-size: 15px; font-weight: 800; line-height: 1.4 } .thMicTrendHint { color: #667985; font-size: 10px; font-weight: 600; margin-top: 4px; line-height: 1.5 } .thMicTrendEmpty { text-align: center; padding: 18px 8px } .thMicTrendPodium { display: flex; align-items: flex-end; justify-content: center; gap: 10px; min-height: 220px; padding: 8px 4px 0 } .thMicTrendPodiumItem { flex: 1; max-width: 108px; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 10px 8px 12px; border-radius: 16px; border: 1px solid rgba(23,70,91,.1); background: linear-gradient(180deg,#fff 0,#f3f8fb 100%); box-shadow: 0 8px 18px rgba(15,23,42,.06) } .thMicTrendPodiumItem.rank-1 { order: 2; min-height: 188px; transform: translateY(-8px); border-color: rgba(255,184,80,.35); background: linear-gradient(180deg,#fff8eb 0,#ffe8c0 100%) } .thMicTrendPodiumItem.rank-2 { order: 1; min-height: 160px; border-color: rgba(192,192,192,.45); background: linear-gradient(180deg,#fff 0,#eef2f6 100%) } .thMicTrendPodiumItem.rank-3 { order: 3; min-height: 148px; border-color: rgba(205,127,50,.35); background: linear-gradient(180deg,#fffaf5 0,#f7e8dc 100%) } .thMicTrendPodiumMedal { color: #17465b; font-size: 11px; font-weight: 800; margin-bottom: 8px; white-space: nowrap } .thMicTrendPodiumAvatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; border: 3px solid #dde8ed; background-color: #f3f6f8; background-size: 100% 100%; background-repeat: no-repeat; background-position: center center } .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar { width: 72px; height: 72px; border-color: #ffb850 } .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar { border-color: silver } .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar { border-color: #cd7f32 } .thMicTrendPodiumName { color: #20313d; font-size: 12px; font-weight: 800; margin-top: 8px; line-height: 1.35; word-break: break-word } .thMicTrendPodiumDuration { color: #667985; font-size: 11px; font-weight: 700; margin-top: 4px; line-height: 1.4 } .thGameTrendPage { padding-bottom: 12px } .thGameTrendSection+.thGameTrendSection { margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(15,23,42,.08) } .thMicTrendRow { gap: 6px } .thMicTrendMedal { flex: 0 0 auto; min-width: 58px; color: #17465b; font-size: 11px; font-weight: 800; white-space: nowrap } .pane__back { position: absolute; top: 0; left: 0; right: auto; z-index: 12; margin: 0; padding: 3px 10px } .pane__back .btn,.pane__back .thMorePaneBackBtn { background: rgba(255,255,255,.94)!important; border: 1px solid rgba(17,24,39,.08)!important; color: #0a84ff!important; height: 32px!important; line-height: 30px!important; padding: 0 12px 0 10px!important; border-radius: 10px!important; font-weight: 700!important; font-size: 14px!important; display: inline-flex!important; align-items: center!important; gap: 6px!important; -ms-touch-action: manipulation; touch-action: manipulation } .pane__back .btn:active,.pane__back .thMorePaneBackBtn:active { opacity: .75!important; transform: translateY(1px)!important } .pane__back .btn .fa,.pane__back .thMorePaneBackBtn .fa { font-size: 13px!important; opacity: .85 } #TH_NOTIF_EMPTY.thNotifEmpty { position: absolute; top: 42px; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: center; padding: 18px; background: 0 0; pointer-events: none; z-index: 1 } #TH_NOTIF_EMPTY .thNotifEmptyCenter { width: 100%; max-width: 520px; text-align: center; padding: 24px 18px 0 } #TH_NOTIF_EMPTY .thNotifEmptyIcon { width: 120px; height: 120px; margin: 0 auto 18px; border-radius: 999px; background: linear-gradient(135deg,rgba(255,149,0,.14),rgba(255,59,48,.1)); display: flex; align-items: center; justify-content: center; font-size: 46px; color: #ff9500; box-shadow: inset 0 0 0 1px rgba(255,149,0,.12) } #TH_NOTIF_EMPTY .thNotifEmptyTitle { color: #111827; font-size: 18px; font-weight: 800; margin: 0 0 8px } #TH_NOTIF_EMPTY .thNotifEmptySub { font-size: 15px; font-weight: 700; color: rgba(17,24,39,.55); margin: 0 } .thPickBtn { border: 1px solid rgba(17,24,39,.1); background: linear-gradient(135deg,#fff 0,#ffe4ef 45%,#d9fbff 100%); color: #111827; padding: 10px 14px; border-radius: 12px; cursor: pointer; box-shadow: 0 10px 20px rgba(17,24,39,.1); font-weight: 800 } .thUP_mask { display: none; position: fixed; inset: 0; background: rgba(17,24,39,.4); z-index: 2147483647; align-items: center; justify-content: center; padding: 16px } .thUP_mask.is-open { display: flex } .thUP_box { width: 300px; background: #fff; border-radius: 2px; overflow: hidden; box-shadow: 0 24px 70px rgba(17,24,39,.18) } .thUP_head { display: flex; align-items: center; padding: 2px; background: var(--bt-primary); border-bottom: 1px solid rgba(17,24,39,.1); justify-content: space-between } .thUP_title { font-weight: 900; color: #fff; font-size: 14px; margin-left: 8px!important } .thUP_close { border: 0; background: #d9534f; color: #fff; width: 32px; height: 32px; border-radius: 10px; cursor: pointer; display: flex; align-items: center; justify-content: center } .thUP_close:hover { background: rgba(17,24,39,.12) } .thUP_list { max-height: 340px; overflow: auto } .thUP_item { position: relative; display: flex; gap: 10px; align-items: center; padding: 10px; cursor: pointer; border-bottom: 1px solid rgba(17,24,39,.08) } .thUP_item.is-sel { outline: rgba(17,24,39,.25) solid 2px } .thUP_item.is-sel:after { content: "\2713"; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-weight: 900; opacity: .9 } .thUP_item:hover { background: rgba(17,24,39,.03) } .thUP_ava { width: 40px; height: 40px; border-radius: 12px; overflow: hidden; background: rgba(17,24,39,.06); flex: 0 0 40px } .thUP_ava img { width: 100%; height: 100%; object-fit: cover; display: block } .thUP_meta { flex: 1; min-width: 0 } .thUP_name { font-weight: 900; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #111827; width: fit-content; padding: 0 } .thUP_sub { margin-top: 2px; overflow: hidden; width: 16px } .thPmEmptyPick { display: flex; align-items: center; justify-content: center; width: 100%; max-width: 100%; margin: 5px auto 10px; padding: 10px 14px; border-radius: 0; background: rgb(34 197 94 / 12%); border: 1px solid rgba(34,197,94,.22); color: #065f46; font-size: 14px; font-weight: 700; cursor: pointer; user-select: none; transition: transform .12s,box-shadow .12s,background .12s,border-color .12s } .thPmEmptyPick:hover { border-color: rgba(34,197,94,.28); box-shadow: 0 1px 2px rgba(0,0,0,.08) } .thPmEmptyPick:active { transform: scale(.98) } .thPmEmptyPick:focus { outline: 0; box-shadow: 0 0 0 3px rgba(34,197,94,.22) } #TH_PM_EMPTY_PICK>span.fa.fa-users { margin-right: 5px; font-weight: 300!important } .thPmTicks { position: relative; width: 18px; height: 12px; vertical-align: middle; line-height: 0!important; display: contents } .thPmTicks i { position: absolute; top: 4px; right: 24px; line-height: 1; font-weight: 300!important; font-size: 11px!important } .thPmTicks i+i { right: 24px; top: 0; font-weight: 300!important; font-size: 11px!important } .thPmTicks.is-delivered i { color: rgba(17,24,39,.6) } .thPmTicks.is-seen i { color: #00bcd4; font-weight: 300!important } #thBcUploadChoice .th-stickers-btn::before,.th-stickers-btn::before { content: "\f118"!important; font-family: FontAwesome!important; font-size: 28px!important; line-height: 1!important; display: inline-block!important; color: #00bcd4!important } #thStickerPanel .th-stk { position: absolute!important; height: 72px!important; box-sizing: border-box!important; background-color: rgba(0,0,0,.02)!important; background-repeat: no-repeat!important; background-position: center!important; background-size: contain!important; border: 1px solid rgba(0,0,0,.07)!important; border-radius: 12px!important; padding: 6px!important; cursor: pointer!important; transition: transform .12s,background-color .12s,border-color .12s!important } #thStickerPanel .th-stk:hover { transform: scale(1.04)!important; background-color: rgba(0,188,212,.06)!important; border-color: rgba(0,188,212,.35)!important } #thStickerGrid { scrollbar-width: thin!important } img.fitsticker { max-width: 90px!important; max-height: 90px!important } .thUhMsg.u-div.break { width: 99%; box-sizing: border-box; padding: 14px 10px; margin: 9px 0 0 2px; text-align: center; font-weight: 700; font-size: 15px!important; line-height: 1.6; color: #b31f14; background: #fff0f0; border: 1px solid rgba(17,24,39,.12); border-radius: 4px } .fa-sign-in::before { content: "\f090"; margin-right: 3px } #d2 div.fl.fa.fa-sign-in.btn.btn-primary.dots.roomh.border.corner { margin-right: 1px!important; margin-left: -4px!important; padding: 4px!important; max-width: 180px!important; min-width: 60px!important; margin-top: 1px!important; font-size: 13px!important } #d2 .uzr.mm { padding: 0 0 0 2px!important } .bgg .uzr.mm { padding: 0 0 0 1px!important } .rank-bades { height: 69px; width: auto; flex: 1 1 auto; text-align: start; display: flex; padding: 0; gap: 0; margin-bottom: 0; border-bottom: 0; justify-content: space-around } html.th-hide-shields .rank-bades,html.th-hide-shields .thProfileShieldTop { display: none!important; height: 0!important; min-height: 0!important; overflow: hidden!important; flex: 0 0 0!important; margin: 0!important; padding: 0!important; gap: 0!important; border: 0!important } .TH_BC_TAB_V3.active,.TH_ROOM_TH_TAB_V3.active { background-color: var(--bg-primary)!important; color: #fff!important } .TIGERHOST_LTD__DPNL__XK30EM03__V3 .btn,.TIGERHOST_LTD__DPNL__XK30EM03__V3 .label { border-radius: 7px!important } .TH_BC_TAB_V3,.TH_ROOM_TH_TAB_V3 { appearance: none; border: 1px solid rgba(255,255,255,.1)!important; border-radius: 17px!important; font-size: 13px!important; letter-spacing: .2px; display: inline-flex!important; align-items: center!important; justify-content: center!important; gap: 8px; transition: transform .12s,background .12s,border-color .12s,box-shadow .12s,color .12s; font-family: 'el messiri'; font-weight: 500!important; background: #f2f2f2; padding: 2px } .TH_BC_TABS_V3,.TH_ROOM_TABS_V3__TH { border: 1px solid rgba(255,255,255,.08); border-radius: 0; padding: 0!important; top: 0; z-index: 3; backdrop-filter: blur(10px); gap: 0!important } .fa-ticket:before { content: "\f145" } .fa-star-half-o:before { content: "\f123" } #sultan13,.Tiger_a,.th-marquee-wrap,marquee { display: none } #btns-wrap.front-style-1 { padding: 0; margin-top: 2px } #login-btn-holder a::before { margin-inline-end:5px} #login-btn-holder.front-style-1 { display: flex; align-items: center; margin: 0; padding: 0; justify-content: center; gap: 3px } .login-btn-holder__btn.front-style-1 { width: 85px; padding: 1px; height: 22px } .login-btn-holder__btn.front-style-1.btn-subs { border-radius: 0 0 0 15px!important } .login-btn-holder__btn.front-style-1.btn-app,.login-btn-holder__btn.front-style-1.btn-rules { border-radius: 0!important } .login-btn-holder__btn.front-style-1.btn-contact { border-radius: 0 0 15px!important } .marquee-wrap.front-style-1,.marquee-wrap.front-style-2 { text-align: center; color: #fff; font-family: jazeera,FontAwesome; margin-right: -1px; margin-top: 3px; border-radius: 30px!important; width: 100%; padding: 1px } .th-marquee-track.front-style-1 span { display: inline-block; padding: 0 12px } #btns-wrap.front-style-2 { padding: 0; margin-top: 3px } #login-btn-holder.front-style-2 { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 0 0 2px; padding: 0 2px; flex-wrap: nowrap } .login-btn-holder__btn.front-style-2 { width: 84px; height: 28px; padding: 3px 6px; border-radius: 999px!important; border: 1px solid rgba(255,255,255,.18)!important; color: #fff!important; font-size: 12px!important; font-weight: 700!important; display: inline-flex!important; align-items: center; justify-content: center; gap: 4px; text-decoration: none!important; transition: transform .2s,box-shadow .2s,background-color .2s,border-color .2s } .login-btn-holder__btn.front-style-2:active,.login-btn-holder__btn.front-style-2:focus,.login-btn-holder__btn.front-style-2:hover { background: linear-gradient(180deg,rgba(148,163,184,.35) 0,rgba(107,114,128,.32) 100%)!important; border-color: rgba(255,255,255,.28)!important; color: #fff!important; box-shadow: 0 6px 16px rgba(0,0,0,.24); transform: translateY(-1px) } .marquee-wrap.front-style-2 { width: 100%; margin-top: 3px; padding: 2px 0; border-radius: 999px; text-align: center; color: #fff; font-family: jazeera,FontAwesome; border: 1px solid rgba(255,255,255,.12); overflow: hidden } .th-marquee-track.front-style-2 span { display: inline-block; padding: 0 14px; font-size: 13px; font-weight: 700; letter-spacing: .2px } #btns-wrap.front-style-3 { padding: 7px 5px; margin-top: 4px; background: rgba(10,25,47,.8); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(0,212,255,.2); border-radius: 3px } #login-btn-holder.front-style-3 { display: flex; align-items: center; justify-content: center; gap: 5px; margin: 0; padding: 0 2px; flex-wrap: nowrap; flex-direction: row-reverse } .login-btn-holder__btn.front-style-3 { flex: 1; display: flex; align-items: center; justify-content: center; gap: 5px; height: 33px; border-radius: 8px!important; text-decoration: none!important; transition: .3s } .login-btn-holder__btn.front-style-3:active,.login-btn-holder__btn.front-style-3:focus,.login-btn-holder__btn.front-style-3:hover { background: rgba(255,255,255,.16)!important; border-color: rgba(255,255,255,.24)!important; color: #fff!important; box-shadow: 0 6px 18px rgba(0,0,0,.24); transform: translateY(-1px) } .marquee-wrap.front-style-3 { width: 100%; margin-top: 4px; padding: 3px 0; border-radius: 999px; text-align: center; color: #fff; font-family: jazeera,FontAwesome; border: 1px solid rgba(255,255,255,.14); overflow: hidden; backdrop-filter: blur(3px); background: linear-gradient(90deg,#152643,#283c5d); border-right: 3px solid #607d8b; border-left: 3px solid #607d8b } .th-marquee-track.front-style-3 span { display: inline-block; padding: 0 14px; font-size: 13px; font-weight: 700; letter-spacing: .2px } #login-btn-holder>a.login-btn-holder__btn.fa.fa-phone.btn.btn-primary.minix.front-style-3.btn-contact { background: linear-gradient(45deg,#ff8c00,#ff4500)!important; color: #fff!important } #login-btn-holder>a.login-btn-holder__btn.fa.fa-android.btn.btn-primary.minix.front-style-3.btn-app,#login-btn-holder>a.login-btn-holder__btn.fa.fa-ticket.btn.btn-primary.minix.front-style-3.btn-rules { color: #fff!important; background: rgba(17,34,64,.9)!important; border: 1px solid #00d4ff!important } #login-btn-holder>a.login-btn-holder__btn.fa.fa-star-half-o.btn.btn-primary.minix.front-style-3.btn-subs { color: #fff!important; background: #9e9e9e!important; border: 1px solid rgba(255,255,255,.1) } #btns-wrap.front-style-4 { padding: 3px; margin-top: 3px; background: #f8fafc; border-radius: 20px; box-shadow: 0 4px 20px rgba(0,0,0,.05); border: 1px solid #e2e8f0 } #login-btn-holder.front-style-4 { display: flex; align-items: center; justify-content: center; gap: 10px; flex-direction: row-reverse } .login-btn-holder__btn.front-style-4 { flex: 1; display: flex; align-items: center; justify-content: center; gap: 5px; height: 34px; border-radius: 20px 5px!important; text-decoration: none!important; transition: .3s cubic-bezier(.4, 0, .2, 1); font-weight: 700; font-size: 11px; text-transform: uppercase } .login-btn-holder__btn.front-style-4:hover { border-radius: 5px 20px; transform: scale(1.05); box-shadow: 0 8px 15px rgba(0,0,0,.1) } #login-btn-holder>a.login-btn-holder__btn.btn-contact.front-style-4 { background: linear-gradient(45deg,#ff79a6,#e91e63)!important; color: #fff!important; border: none } #login-btn-holder>a.login-btn-holder__btn.btn-app.front-style-4 { background: #fff!important; color: #1e293b!important; border: 2px solid #1e293b!important } #login-btn-holder>a.login-btn-holder__btn.btn-rules.front-style-4 { background: #1e293b!important; color: #f1f5f9!important; border: none!important } #login-btn-holder>a.login-btn-holder__btn.btn-subs.front-style-4 { background: #fbbf24!important; color: #78350f!important; border: 1px solid #d97706!important } .marquee-wrap.front-style-4 { width: 100%; margin-top: 3px; padding: 3px; border-radius: 1px; background: #ebebeb!important; overflow: hidden; color: #000; border-left: 4px solid var(--bt-primary) } .th-marquee-track.front-style-4 span { padding: 0 25px; font-size: 13px; font-weight: 600 } .fa-hand-paper-o:before { content: "\f256"; font-family: FontAwesome } .th-marquee-track { display: flex; white-space: nowrap; min-width: 100%; padding: 0 } #tlogins>div.label.bg.d-flex.fl:focus,a:focus { outline: -webkit-focus-ring-color auto 5px!important; outline-offset: -2px!important } .btn.active.focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn:active:focus,.btn:focus,a.label.bg.d-flex.fl:focus,a.label.bg.d-flex.fl:focus-visible,div.label.bg.d-flex.fl:focus,div.label.bg.d-flex.fl:focus-visible { outline: -webkit-focus-ring-color auto 5px; outline-offset: -2px } .btn.focus,.btn:focus,.btn:hover { text-decoration: none } .tutop10 { display: flex; justify-content: center; margin: 40px 0 0 } .top-user { text-align: center; position: relative } .top-img { border-radius: 50% } .top-img-small { padding: 2px; width: 80px; height: 80px } .top-img-big { width: 90px; height: 90px } .top-user-2 .top-img { border: 4px solid silver; margin: 20px 25px 10px 10px } .top-user-1 .top-img { border: 4px solid rgb(255 152 0) } .top-user-3 .top-img { border: 4px solid #cd7f32; margin: 25px 10px 10px 25px } .top-crown { width: 55px; margin-block-start:-228px} .top-name { position: relative; font-family: cursive; color: #fff } .top-name-1 { margin-top: -10px } .top-name-2 { left: -7px } .top-name-3 { width: 100px; left: 15px } .top-badge { position: absolute; color: #312244; font-size: 15px!important; border-radius: 50%; height: 30px; width: 30px; margin-top: -48px; border: 4px solid #312244 } .top-badge-1 { background: rgb(255 152 0); margin-left: 30px } .top-badge-2 { background: silver; margin-left: 35px } .top-badge-3 { background: #cd7f32; margin-left: 49px } .top-rank { position: relative; font-family: sans-serif; color: #a9a9a9; font-size: 13px!important } .top-rank-2 { left: -7px } .top-rank-3 { left: 10px } .ltop { height: auto; margin: 20px } .th-settings { height: 100%; width: 100%; padding: 0; border: 1px solid } .th-settings-box { background-color: #fff; width: 100%; margin-top: -2px } .th-settings-title { display: inline-block; width: 132px; margin-top: 2px; height: 25px; padding: 1px } .th-settings-title-status { margin-top: 1px } .th-settings-input { width: 99% } .th-color-row { padding: 1px; height: 26px; display: flex; flex-direction: row-reverse; justify-content: flex-end } .th-color-row-first { margin-top: 2px } .th-color-row-mcolor { margin-left: -1px } .th-color-container { position: relative; display: inline-block; z-index: 5000; margin-left: 3px } .th-color-input-black { background-color: #000 } .th-color-input-white { background-color: #fff } .th-color-btn { margin-left: auto; width: 64px; height: 22px; border-radius: 0!important } .th-color-btn-black { background-color: #000 } .th-color-btn-white { background-color: #fff } .th-color-label { display: inline-block; height: 25px; padding: 1px; width: 132px } .th-color-label-mcolor { margin-left: 1px } .th-color-label-bg { margin-left: -1px; height: 23px; width: 133px } .th-save-profile-btn { padding: 6px; width: 98%; margin-left: 3px; margin-top: 0; margin-bottom: 4px } .th-settings-select { width: 98%; margin: 2px 4px } .th-settings-action { margin: 2px 4px; padding: 8px; width: 98%; color: #000 } .th-settings-action-small { margin: 1px 4px; padding: 6px; color: #000 } .th-settings-ghost { background-color: #f8f8ff } .th-settings-pic { width: 32px; height: 32px; margin: -7px -8px -8px 0 } .th-settings-block { display: block } #add-link-btn { cursor: pointer; border-radius: 3px; background: url('/imgs/social.png') 0 0/100% no-repeat #000; color: #fff; font-size: 13px; text-align: center; margin: 2px 1px; padding: 8px; width: 100%; height: auto; line-height: normal; border: 1px solid #000; transition: .3s; transform-origin: center center; transform: rotate(0); font-family: 'El Messiri',FontAwesome!important; font-weight: 300!important } #add-link-modal { display: none; position: fixed; inset: 0; z-index: 100000 } #add-link-modal.is-open { display: block } #add-link-modal .alm-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.55) } #add-link-modal .alm-card { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: min(92vw,520px); background: #fff; border-radius: 14px; box-shadow: 0 10px 30px rgba(0,0,0,.35); overflow: hidden; font-family: Cairo,system-ui } #add-link-modal .alm-head { padding: 14px 16px; background: var(--bt-primary); display: flex; align-items: center; justify-content: space-between } #add-link-modal .alm-title { font-weight: 800; font-size: 15px; color: #fff } #add-link-modal .alm-close { width: 32px; height: 32px; border: none; border-radius: 8px; background: #c70000; color: #fff; cursor: pointer } #add-link-modal .alm-body { padding: 16px } #add-link-modal .alm-hint { font-size: 13px; color: #244176; margin-bottom: 8px } #add-link-modal .alm-label { display: block; font-weight: 800; font-size: 13px; color: #244176; margin-bottom: 8px } #add-link-modal #alm-input { width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid #2a355a; background: #fff; color: #244176; font-size: 14px; outline: 0; box-sizing: border-box } #add-link-modal .alm-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 14px } #add-link-modal .alm-cancel { padding: 8px 12px; border-radius: 10px; border: 1px solid #c70000; background: #fff; color: #c70000; cursor: pointer } #add-link-modal .alm-save { padding: 8px 14px; border-radius: 10px; border: 0; background: var(--bt-primary); color: #fff; font-weight: 700; cursor: pointer } .th-settings-more-btn { background: linear-gradient(90deg,#1b84f2,#00c9a7,#ff6fd8,#6c63ff); background-size: 300% 300%; animation: 6s infinite gradientMove; color: #fff; padding: 6px!important; border-radius: 10px; font-weight: 700; border: 0!important; margin-bottom: 1px!important; text-shadow: 0 1px 2px rgba(0,0,0,.3) } .th-settings-more-icon { padding: 0 4px; float: left } .th-settings-action.SERT { color: #fff } .th-uhtml-main { padding-right: 16px; width: 100%; overflow: hidden } .th-uhtml-aft { display: none } .th-uhtml-muted { color: #cd5c5c; display: none; width: 16px; margin-right: -16px } .th-uhtml-body { padding: 0 3px; overflow: revert } .th-uhtml-topic-row { width: 100%; display: flex; align-items: center; margin-top: 0; height: 21px } .th-uhtml-topic-row .flex-grow-1 { min-width: 0 } .th-uhtml-icon { min-height: 10px; margin-top: 0; margin-right: 3px } .th-uhtml-topic { padding-top: 1px; max-width: 100%; border-radius: 2px } .th-uhtml-stars { margin-top: 0; display: flex; margin-left: 0; flex-shrink: 0 } .new-stars_users_uhtml.thUserLevel,.thUserLevel { display: inline-flex; align-items: center; justify-content: flex-end; width: auto; max-width: 52%; margin: 0 0 0 6px; min-height: 20px; line-height: 1; overflow: visible; flex-shrink: 0 } #lonline>div>div.d-flex.fl>div>div.new-stars_users_uhtml,#lonline>div>div.d-flex.fl>div>div.new-stars_users_uhtml.thUserLevel { margin-top: 0!important; margin-bottom: 0; padding-top: 0; justify-content: flex-end; width: auto } .thUserLevelShine { position: relative; display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px 2px 8px; border-radius: 999px; font-size: 10px!important; line-height: 1.15; color: #8f7340; background: linear-gradient(145deg,rgba(255,252,246,.96) 0,rgb(247 240 226 / 35%) 48%,rgba(255,255,255,.82) 100%); border: 0 solid; letter-spacing: .04em; overflow: hidden; white-space: nowrap; -webkit-font-smoothing: antialiased } .thUserLevel .thUserLevelShine .thUserLevelLv { font-size: 10px!important; font-weight: 600; color: #b8892a; letter-spacing: .07em; line-height: 1.1 } .thUserLevel .thUserLevelShine .thUserLevelSep { display: inline-block; width: 3px; height: 3px; margin: 0 1px; padding: 0; border-radius: 50%; background: linear-gradient(135deg,#d8b45a 0,#a67c1d 100%); opacity: .72; font-size: 0!important; line-height: 0; overflow: hidden; flex-shrink: 0 } .thUserLevel .thUserLevelShine .thUserLevelPts { font-size: 10px!important; font-weight: 500; color: #9a7d42; letter-spacing: .02em; line-height: 1.1 } .thUserLevelShine::after { content: ''; position: absolute; top: 0; left: -45%; width: 42%; height: 100%; background: linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent); animation: 1.4s ease-in-out infinite thUserLevelShineMove; pointer-events: none; z-index: 2 } @keyframes thUserLevelShineMove { 0%,35% { transform: translateX(0); opacity: 0 } 48% { opacity: 1 } 100%,70% { transform: translateX(290%); opacity: 0 } } .th-uhtml-msg { color: #888; padding: 1px; margin-top: 0!important } .th-uhtml-side { margin-left: -32px } .th-uhtml-hash { color: grey; font-size: 70%!important } .th-room-item { text-align: left; width: 100%; border-bottom: 1px solid #e6e6fa; padding: 0 0 0 1px; background-color: #fafafa } .th-room-main { overflow: hidden; padding: 0 } .th-room-pic { min-width: 52px; width: 52px; min-height: 54px; max-height: 54px; background-color: #f3f3f3; border: 0 } .th-room-body { padding: 0 2px; overflow: hidden } .th-room-topic-row { width: 100%; display: flex; overflow: hidden; line-height: normal; margin-top: 1px } .th-room-topic { padding: 0 4px; max-width: 100%; border-radius: 2px } .th-room-msg { color: #888; margin-top: -1px } .th-room-count { padding: 3px; margin: 1px; border-radius: 1px; min-width: 60px; text-align: center; font-size: 14px!important } .th-call-hidden { display: none } .th-call-box { text-align: center; position: absolute; top: 60px; margin-left: 60px; z-index: 9999 } .th-call-not-box { background-color: #363636; width: 220px; padding: 11px } .th-video-box { background-color: #222; width: 320px; padding: 4px; border-radius: 3px!important } .th-call-user { width: 100% } .th-call-user-row { text-align: left; border-radius: 0!important; width: 99%; margin: 0 1px -1px 2px!important; padding: 1px } .th-video-user-row { border: 0 } .th-call-pic { width: 36px; height: 36px; margin-left: 1px; border-radius: 50%; border: 1.5px solid #fff } .th-video-pic { border-radius: 50%!important; border: 1.5px solid #fff!important } .th-call-info { width: 72% } .th-call-info-inner { width: 100%; margin-top: -2px } .th-call-name-wrap { width: 82% } .th-call-name { margin-top: 1px; padding: 0 8px; max-width: 100%; border-radius: 3px; background-color: rgb(255 255 255 / 0%); color: rgb(255 255 255) } .th-video-name { font-weight: 100!important; margin-left: -50px } .th-call-action-btn { border-radius: 50%!important; width: 50px; height: 40px; padding: 8px 0 0; font-weight: 300!important } .th-call-video { width: 10%; position: absolute; height: 0 } .th-call-control { padding: 5px 12px 12px!important; border-radius: 50%!important; font-size: 21px!important; height: 40px!important } .th-call-hangup { background: #e90039; color: #fff; font-weight: 100!important } .th-call-state { margin-left: 4px; margin-top: 5px; color: #fff; font-size: 13px!important; padding-top: 5px!important; border-radius: 40px!important } .th-call-mic { width: 45px; background: #343434; color: #fff; font-weight: 100!important; margin: 0 19px 0 0 } .th-call-volume { background: #fff; color: #343434; font-weight: 300!important; margin: 0 8px 4px 0!important } .th-utop-hidden { display: none } .th-utop-item { padding: 5px; text-align: left; background-color: #fff; border-radius: 30px!important; width: 100%; margin-bottom: 10px } .th-utop-number { position: relative; top: 1px; color: #2e2e2e; padding: 11px; text-align: center; font-weight: 700; font-family: sans-serif,'trebuchet ms','lucida grande','lucida sans unicode',arial,helvetica } .th-utop-pic { width: 46px; height: 46px; padding: 5px; background-color: #f3f3f3; border-radius: 50% } .th-utop-score { position: relative; top: 13px; color: #666; text-align: right; font-size: 13px!important; font-weight: 700; font-family: sans-serif,'trebuchet ms','lucida grande','lucida sans unicode',arial,helvetica } .th-utop-body { width: 120px; padding: 2px 4px } .th-utop-topic-row { width: 100%; display: flex } .th-utop-topic { font-family: sans-serif,'trebuchet ms','lucida grande','lucida sans unicode',arial,helvetica; margin-top: 9px; font-size: 15px!important } .th-uhead-hidden { display: none } .th-uhead-item { margin: 3px } .th-uhead-status { width: 4px; height: 22px } .th-uhead-pic { width: 36px; height: 36px } .th-uhead-info { width: 100%; margin-top: 0 } .th-uhead-topic { max-width: 100%; padding: 0 4px; border-radius: 0; margin-left: 1px } .th-cw-box { border-radius: 2px; position: absolute; top: 1px; min-height: 190px; margin-top: -1px; max-height: 500px; bottom: 46%; width: 99.8%; max-width: 500px; z-index: 2; overflow: hidden; -ms-touch-action: pan-y; touch-action: pan-y } .th-showphoto-ov { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 999999; overflow: auto; -webkit-overflow-scrolling: touch; background-color: rgba(8,10,14,.72); -webkit-tap-highlight-color: transparent; touch-action: manipulation; opacity: 0; -webkit-transition: opacity .22s; transition: opacity .22s } .th-showphoto-ov.th-showphoto-on { opacity: 1 } .th-showphoto-wrap { position: relative; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; box-sizing: border-box; min-width: 100%; min-height: 100%; padding: 52px 12px 12px } .th-showphoto-spin { display: none; width: 38px; height: 38px; box-sizing: border-box; border: 3px solid rgba(255,255,255,.28); border-top-color: #fff; border-radius: 50%; pointer-events: none } .th-showphoto-spin.th-showphoto-spin-on { display: block; -webkit-animation: .7s linear infinite th-showphoto-spin; animation: .7s linear infinite th-showphoto-spin } @-webkit-keyframes th-showphoto-spin { from { -webkit-transform: rotate(0); transform: rotate(0) } to { -webkit-transform: rotate(360deg); transform: rotate(360deg) } } @keyframes th-showphoto-spin { from { -webkit-transform: rotate(0); transform: rotate(0) } to { -webkit-transform: rotate(360deg); transform: rotate(360deg) } } .th-showphoto-img { display: block; width: auto; height: auto; max-width: 92vw; max-height: 82vh; margin: 0; object-fit: contain; pointer-events: none; -webkit-user-select: none; user-select: none; opacity: 0; border-radius: 10px; border: 1px solid rgba(255,255,255,.14); box-shadow: 0 12px 40px rgba(0,0,0,.45),0 2px 8px rgba(0,0,0,.25); -webkit-transform: scale(.98); transform: scale(.98); -webkit-transition: opacity .28s,-webkit-transform .28s; transition: opacity .28s,transform .28s } .th-showphoto-img.th-showphoto-img-on { opacity: 1; -webkit-transform: scale(1); transform: scale(1) } .th-showphoto-x { position: fixed; top: 10px; right: 10px; z-index: 1000000; width: 42px; height: 42px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: rgba(0,0,0,.7); color: #fff; font-size: 30px; line-height: 42px; text-align: center; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation } #upro.th-upro-photo-anim { -webkit-transition: opacity .22s!important; transition: opacity .22s!important } #upro.th-upro-photo-fade { opacity: 0!important; pointer-events: none!important } .modal-backdrop.th-upro-photo-anim { -webkit-transition: opacity .22s!important; transition: opacity .22s!important } .modal-backdrop.th-upro-photo-fade { opacity: 0!important; pointer-events: none!important } .bwall,.pmc { margin-right: 3px } .th-cw-head { width: 100%; height: 30px } .th-cw-user { margin: 2px } .th-cw-expand { padding: 4px 4px 0 12px; right: 34px; position: absolute; height: 30px } .th-cw-hide { position: absolute; right: 0; padding: 6px 5px 5px 11px } .th-cw-cont { width: 100%; flex: 1 1 0%; height: 0; min-height: 0; overflow: hidden!important; overflow-x: hidden!important; overflow-y: hidden!important; -ms-touch-action: pan-y; touch-action: pan-y } .th-cw-d2 { background-color: #fff; min-height: 0; height: 0; max-height: 100%; flex: 1 1 0%; overflow-x: hidden!important; overflow-y: auto!important; -webkit-overflow-scrolling: touch; -ms-touch-action: pan-y; touch-action: pan-y; overscroll-behavior: contain } .th-cw-footer { width: 100%; height: 42px; padding: 4px; -ms-touch-action: manipulation; touch-action: manipulation } .th-cw-typ { display: flex; position: absolute; right: 20px; margin-top: -12px } .th-cw-small-btn { margin-right: 3px; margin-top: 2px; border-radius: 2px } .th-cw-icon-btn { margin: 2px 3px 0 -2px; border-radius: 2px; display: inline } .th-cw-hidden { display: none } .th-cw-emo { padding: 5px; width: 34px; height: 34px } .th-cw-send { margin-left: 2px } .th-mmnot-modal { z-index: 99999 } .th-mmnot-content { width: 310px } .th-mmnot-header { color: #fff } .th-mmnot-title { margin: 1px } .th-mmnot-body { padding: 1px } .th-mmnot-box { background-color: #efefef; padding: 5px } .th-mmnot-textarea { width: 100%; resize: none; height: 48px; max-height: 48px } .th-mmnot-emo { padding: 5px; width: 34px; height: 34px } .th-rpl-modal { margin: 5px; display: none } .th-rpl-dialog { height: 50%; min-height: 300px; overflow: visible; margin-top: 2px } .th-rpl-content { width: 306px; height: 100%; flex: 0 1 auto } .th-rpl-header { color: #fff } .th-rpl-title { margin: 1px } .th-rpl-body { padding: 0; flex: 0 1 auto } .th-rpl-rmsg { width: 100%; border-bottom: 1px solid #000 } .th-rpl-item { border-bottom: 1px solid #e6e6fa; margin: 0; width: 100%; padding: 0 0 0 2px } .th-rpl-pic { min-width: 52px; width: 52px; height: 46px; background-color: #f3f3f3; background-position-y: 0 } .th-rpl-item-body { padding-top: 1px; padding-left: 1px } .th-rpl-head { width: 100%; display: flex; height: 21px } .th-rpl-user { overflow: hidden } .th-rpl-icon { min-height: 14px } .th-rpl-topic { padding: 1px 4px; display: block; margin-left: 1px; border-radius: 2px; color: #000 } .th-rpl-head-right { height: 21px; overflow-y: visible } .th-rpl-msg { padding: 0 1px 1px 5px; width: 100%; color: #000 } .th-rpl-actions { max-width: 92px; height: 21px } .th-rpl-replies-wrap { background-color: #efefef; border-left: 4px solid grey } .th-rpl-replies { height: 100% } .th-rpl-footer { width: 100%; height: 42px; padding: 4px; flex: 0 0 auto } .th-rpl-emo { padding: 5px; width: 34px; height: 34px } .th-rpl-send { margin-left: 2px } .th-mnot-content { width: 310px } .th-mnot-header { color: #fff } .th-mnot-title { margin: 1px } .th-mnot-body { padding: 1px } .th-mnot-box { background-color: #efefef; padding: 5px } .th-mnot-textarea { width: 100%; resize: none; height: 48px; max-height: 48px } .th-mnot-emo { padding: 5px; width: 34px; height: 34px } .th-mnot-checkbox { padding-top: 6px } .th-mkr-modal { z-index: 9999 } .th-mkr-content { width: 310px } .th-mkr-header { color: #fff } .th-mkr-title { margin: 1px } .th-mkr-body { padding: 1px } .th-mkr-box { background-color: #efefef; padding: 5px } .th-mkr-input { width: 200px; border-radius: 0; border: 1px solid #b7b7b7; height: 30px; margin: 0 0 5px; text-align: center } .th-mkr-input:first-of-type { margin-top: 5px } .th-mkr-color-wrap { position: relative; z-index: 500000 } .th-mkr-color-input { background: #1a1a1a!important } .th-mkr-color-btn { outline: 0; width: 70px; margin: 0 4px; height: 33px; border: 1px solid #000; right: 12px; position: absolute; top: -34px; background: #191919 } .th-mkr-pic { position: absolute; width: 80px; height: 80px; top: 56px; border: 2px solid; right: 17px } .th-mkr-delpic { position: absolute; width: 90px; height: 29px; top: 144px; right: 9px; border: 1px solid; text-align: center; padding: 4px; font-size: 13px!important } .th-mkr-label { margin-left: 10px } .th-mkr-mic-input-hidden { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; margin: 0; padding: 0; border: 0 } .th-mkr-mic-picker { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0; width: 100% } .th-mkr-mic-icons { display: flex; gap: 4px; flex-wrap: nowrap } .th-mkr-mic-btn { border: 1px solid #b7b7b7; background: #fff; border-radius: 6px; padding: 2px 5px; line-height: 1; cursor: pointer; min-width: 32px; min-height: 30px } .th-mkr-mic-btn.th-mkr-mic-off { background: #f3f3f3; opacity: .75 } .th-mkr-mic-emoji { font-size: 16px; line-height: 1 } .th-mkr-mic-hint { font-size: 12px; color: #444; flex: 1 1 100%; margin: 0 0 2px; line-height: 1.2 } #mkr .th-mkr-mic-picker+.th-mkr-label,#mkr .th-mkr-mic-picker+.th-mkr-label+br { display: none!important } .th-mkr-ops { width: 100%; padding: 2px } .th-mkr-bans { width: 100%; padding: 2px; margin-top: 4px } .th-mkr-bans-head { width: 100% } .th-mkr-bans-btn { width: 38px } .th-mkr-bans-list { width: 100% } .th-mic-wrap { margin-left: 0 } .mic_chat>div>.corner { left: 0; position: relative } .mic_chat>div>.th-mic-cam { margin: 1px!important } .th-mic-cam { display: flex; justify-content: center; align-items: center; margin: 1px -55px 0 -11px!important } .th-mic-evant { display: none; width: 52px } .th-mic-name { position: relative; color: #fff; top: 45px; display: block; font-size: 12px!important; background: #000 } .th-mic-menu { position: absolute; display: none; background: #e0e0e0; margin-top: 45px; padding: 5px; margin-left: -23px; border-radius: 10px; z-index: 10055 } .th-mic-menu.th-mic-menu-open { display: flex!important; flex-direction: column } .th-mic-menu.th-mic-menu-open>.stopmic.th-show-stop { display: block!important } .th-mic-menu.th-mic-menu-open>.profiles,.th-mic-menu.th-mic-menu-open>.sounds { display: inline-block!important } .th-mic-btn { width: 80px; font-size: 9px!important } .th-mic-stop { display: none } .mic_chat>div>.th-mic-sound-off,.mic_chat>div>.th-mic-sound-on { left: 0 } .th-mic-sound-on { margin-top: 1px; padding: 1px 0 0 5px; width: 57px; height: 51px; color: #000; background-color: #3cb371; border-radius: 4px!important; position: relative; transition: none; animation: none } .th-mic-sound-off { margin-top: 1px; padding: 1px 0 0 5px; width: 57px; height: 51px; color: #000; background-color: #d3372b; border-radius: 4px!important; left: -61px; position: relative; transition: none; animation: none; display: none } .th-mic-sound-icon { margin-left: 10%; font-size: 38px!important; margin-top: -2px } .th-story-panel { position: fixed; display: none; width: 100%; height: 100%; background: #000; z-index: 99999999; left: 0; top: 0; padding: 10px } #StoryPanel #StoryProgress { background: 0 0; width: 100%; position: absolute; top: 0; left: 0; right: 0; z-index: 10050; pointer-events: auto } #StoryPanel .story-progress { position: absolute; top: 8px; left: 8px; right: 8px; z-index: 10050; pointer-events: auto } .th-story-pic { border-radius: 50%; width: 50px; height: 50px; border: 2px solid #fff; margin-top: 12px; z-index: 10050; position: relative; pointer-events: auto } .th-story-info { float: left; padding: 0; color: #fff; font-size: 15px!important; font-family: cursive; margin-top: 10px; z-index: 10050; position: relative; display: flex; flex-direction: column; align-items: center; align-content: center; gap: 8px; margin-left: 14px; pointer-events: auto } .th-story-topic { display: contents } .th-story-time { font-size: 11px!important; color: #a9a9a9; top: -6px; font-family: cursive; position: relative } .th-story-actions { right: 10px; margin-top: 10px; position: relative; z-index: 10050; pointer-events: auto } .th-story-action-hidden { display: none; color: #fff; margin-right: 20px; font-size: 20px!important; position: relative; z-index: 10000 } .th-story-close { color: #fff; font-size: 20px!important; margin-right: 10px; position: relative; z-index: 10000 } .th-story-loader { z-index: 11; font-size: 50px!important; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%) } .th-story-video { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 2; display: block; pointer-events: none } .th-story-photo { position: absolute; width: 100%; height: 100%; top: 0; display: none; left: 0; z-index: -1; background-repeat: no-repeat; background-position: center; background-size: contain; pointer-events: none } .th-story-photo-img { display: none } .th-story-view { position: absolute; bottom: 10px; right: 10px; color: #fff; font-size: 13px!important } .th-story-download { position: absolute; left: 15px; top: calc(51% + 118px); font-size: 30px!important; color: #fff; text-shadow: 0 0 5px #000!important; cursor: pointer; z-index: 9999; user-select: none } .th-story-viewers { display: none } .th-story-comment-icon { position: absolute; left: 13px; top: calc(50% + 50px); font-size: 30px!important; color: #fff; text-shadow: 0 0 5px #000!important; cursor: pointer; z-index: 10050; user-select: none; background: rgba(0,0,0,.01); touch-action: manipulation; -webkit-tap-highlight-color: rgba(255,255,255,0.18); pointer-events: auto } .th-story-comment-icon:after { content: ''; position: absolute; top: -14px; right: -14px; bottom: -14px; left: -14px; background: rgba(0,0,0,.01) } .th-story-comment-count { position: absolute; left: 0; margin-left: 21px; top: calc(50% + 85px); font-size: 16px!important; color: #fff; text-shadow: 0 0 5px #000!important; z-index: 10050; user-select: none; margin-top: 8px; pointer-events: none } .th-story-comments-popup { display: none; position: absolute; bottom: 80px; left: 50%; transform: translateX(-50%); width: 90%; max-height: 250px; overflow-y: auto; background: rgba(0,0,0,.7); color: #fff; border-radius: 8px; padding: 10px; z-index: 9999999999; font-size: 14px } .th-story-comment-row { display: flex; margin-top: 10px } .th-story-comment-input { flex: 1; padding: 5px; border-radius: 4px; border: none } .th-story-comment-send { padding: 5px 10px; margin-left: 5px; border: none; border-radius: 4px; cursor: pointer } .th-grid-dialog { max-width: 430px; width: calc(100% - 20px); margin: 30px auto } .th-grid-content { border: 0; border-radius: 22px; overflow: hidden; box-shadow: 0 25px 80px rgba(0,0,0,.22); background: linear-gradient(180deg,#fff 0,#fff8fc 100%) } .th-grid-header { border: 0; padding: 14px 14px 10px; background: linear-gradient(135deg,#fff 0,#ffe4ef 45%,#d9fbff 100%); position: relative } .th-grid-close { width: 34px; height: 34px; border-radius: 50%!important; padding: 0!important; border: 1px solid rgba(17,24,39,.1); background: #fff; color: #111827; box-shadow: 0 8px 22px rgba(17,24,39,.1); margin: 0 } .th-grid-title { margin: 6px 0 0; color: #111827; font-weight: 800; font-size: 19px } .th-grid-body { padding: 14px } .th-grid-card { display: flex; gap: 12px; align-items: flex-start; background: #fff; border: 1px solid rgba(17,24,39,.08); border-radius: 18px; padding: 12px; box-shadow: 0 10px 30px rgba(17,24,39,.06) } .th-grid-img { width: 92px; height: 92px; min-width: 92px; object-fit: cover; border-radius: 18px; border: 0; box-shadow: 0 10px 25px rgba(122,47,255,.18); padding: 0; background: #fff } .th-grid-info { flex: 1; min-width: 0 } .th-grid-msg { background: linear-gradient(135deg,#7a2fff 0,#e30079 100%); border-radius: 14px; padding: 10px 12px; box-shadow: 0 10px 22px rgba(122,47,255,.18); text-align: center } .th-grid-msg-text { margin: 0; color: #fff; display: block; font-size: 14px!important; font-weight: 700; line-height: 1.7 } .th-grid-boot { margin-top: 10px; color: #255f91 } .th-grid-boot-text { display: block; text-align: right; line-height: 1.9; font-size: 14px; color: #334155 } .th-grid-footer { border: 0; padding: 0 14px 14px; background: 0 0 } .th-grid-run { width: 100%; height: 46px; border: 0; border-radius: 16px; background: linear-gradient(135deg,#7a2fff 0,#e30079 100%); color: #fff; font-size: 15px; font-weight: 800; box-shadow: 0 14px 30px rgba(122,47,255,.24) } .th-grid-stop { width: 100%; height: 46px; border: 1px solid rgba(220,38,38,.14); border-radius: 16px; background: #fff; color: #dc2626; font-size: 15px; font-weight: 800; margin-top: 10px; box-shadow: 0 10px 22px rgba(17,24,39,.06) } .th-yt-modal { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); color: #e6edf7; width: 360px; padding: 0; border-radius: 14px; box-shadow: 0 10px 30px rgba(0,0,0,.35); display: none; z-index: 10001; font-family: Cairo,system-ui } .th-yt-header { padding: 14px 16px; background: var(--bt-primary); display: flex; align-items: center; justify-content: space-between; border-top-right-radius: 14px; border-top-left-radius: 14px } .th-yt-title-wrap { display: flex; align-items: center; gap: 10px } .th-yt-icon { font-size: 20px; color: #fff } .th-yt-title { font-weight: 800; font-size: 15px; color: #fff } .th-yt-close { width: 32px; height: 32px; border: none; border-radius: 8px; background: #c70000; color: #fff; cursor: pointer } .th-yt-search-box { position: relative; width: 100%; padding: 16px; background: #fdfdfd; border-radius: 0 0 14px 14px } .th-yt-search-row { display: flex; align-items: center; gap: 10px } .th-yt-search-icon { font-size: 18px; color: var(--bt-primary); cursor: pointer } .th-yt-input { flex: 1; border-radius: 10px; padding: 10px 12px; font-size: 14px!important; border: 1px solid var(--bt-primary); outline: 0; color: #2d2d2d } .th-yt-container { border-radius: 10px; margin-top: 12px; display: flex; flex-wrap: wrap; gap: 10px; max-height: 300px; overflow-y: auto; padding: 10px } .th-yt-toggle { height: 28px; background: var(--bt-primary); border: 0; text-align: center; color: #e6edf7; padding: 0 10px; cursor: pointer; font-size: 16px!important; border-radius: 8px; display: none; margin-top: 10px } .th-yt-footer { display: flex; gap: 8px; justify-content: flex-end; margin-top: 14px } .th-sticker-panel { display: none; position: fixed; inset: 0; z-index: 9999 } .th-sticker-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.25) } .th-sticker-box { position: absolute; right: 12px; bottom: 120px; width: 340px; max-width: 92vw; background: #fff; border-radius: 14px; box-shadow: 0 14px 40px rgba(0,0,0,.18); overflow: hidden } .th-sticker-header { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; border-bottom: 1px solid rgba(0,0,0,.08) } .th-sticker-title { font-size: 14px; font-weight: 700 } .th-sticker-close { background: 0 0; border: none; cursor: pointer; font-size: 18px; line-height: 1 } .th-sticker-grid { display: block; position: relative; padding: 0; max-height: 320px; overflow: auto } .th-stk-virt-spacer { width: 100%; pointer-events: none } .th-camera-modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.6); z-index: 9999; display: none; justify-content: center; align-items: center } .th-camera-box { background: #f9f9f9; padding: 25px 20px; border-radius: 12px; text-align: center; max-width: 340px; width: 90%; box-shadow: 0 10px 25px rgba(0,0,0,.25); font-family: 'Segoe UI',sans-serif } .th-camera-title { margin-bottom: 20px; font-size: 17px; font-weight: 600; color: #333 } .th-camera-actions { display: flex; justify-content: center; gap: 12px; margin-bottom: 20px } .th-camera-btn { flex: 1; padding: 10px; color: #fff; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; transition: background-color .3s } .th-camera-front { background-color: #3f51b5 } .th-camera-back { background-color: #009688 } .th-camera-cancel { padding: 8px 18px; background-color: #e53935; color: #fff; border: none; border-radius: 6px; cursor: pointer; font-size: 13px; transition: background-color .3s } .th-wetch-panel { height: 100%; width: 100%; background: #f2f2f7!important; box-shadow: none; border-radius: 0; padding: 0!important; overflow: hidden } .th-wetch-layout { display: flex; flex-direction: column; height: calc(100% - 15px); min-height: 0 } .th-wetch-top-wrap { flex: 0 0 auto; background: radial-gradient(circle at 88% 10%,rgba(236,72,153,.32) 0,transparent 40%),radial-gradient(circle at 10% 90%,rgba(56,189,248,.26) 0,transparent 38%),radial-gradient(circle at 50% 0,rgba(251,191,36,.22) 0,transparent 34%),linear-gradient(155deg,#1e1b4b 0,#312e81 38%,#4c1d95 72%,#1e3a5f 100%); padding: 10px 12px 14px; border-radius: 0 0 22px 22px; box-shadow: 0 14px 34px rgba(49,46,129,.22); border-bottom: 1px solid rgba(167,139,250,.28) } .th-wetch-feed-title,.th-wetch-top-title { font-size: 12px; font-weight: 800; letter-spacing: .3px; margin: 0 0 8px; text-align: center } .th-wetch-top-title { color: #f5d0fe; text-shadow: 0 2px 12px rgba(236,72,153,.32); font-size: 14px } .th-wetch-feed-title { color: #5b21b6; padding: 0 2px; background: linear-gradient(90deg,#7c3aed,#6366f1,#ec4899); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent } .th-wetch-tabs { justify-content: center; margin: 0 0 10px; direction: rtl } .th-wetch-top { min-height: 230px; padding: 2px 0 4px } .th-wetch-top-empty { text-align: center; color: rgba(226,232,240,.82); font-size: 13px; font-weight: 700; padding: 24px 8px } .th-wetch-podium-arena.thMicTrendPodium { min-height: 220px; padding: 4px 2px 0 } .th-wetch-podium-arena .thMicTrendPodiumItem { border: 1px solid rgba(255,255,255,.14); background: linear-gradient(180deg,rgba(255,255,255,.96) 0,rgba(241,245,249,.92) 100%); box-shadow: 0 10px 24px rgba(2,6,23,.14) } .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 { border-color: var(--th-star-podium-rank-1-border,rgba(251,191,36,.55)); background: var(--th-star-podium-rank-1-bg,linear-gradient(180deg,#fff9eb 0,#fde68a 100%)); box-shadow: 0 0 28px var(--th-star-podium-glow,rgba(251,191,36,.32)),0 14px 28px rgba(2,6,23,.16) } .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1.th-wetch-champion { border-width: 2px; border-color: var(--th-star-podium-rank-1-border,rgba(245,158,11,.72)); background: var(--th-star-podium-rank-1-bg,linear-gradient(180deg,#fffdf5 0,#fde68a 42%,#fbbf24 100%)); box-shadow: 0 0 36px var(--th-star-podium-glow,rgba(251,191,36,.42)),0 18px 34px rgba(2,6,23,.18); transform: translateY(-4px) } .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1.th-wetch-champion .thMicTrendPodiumMedal { font-size: 13px; letter-spacing: .2px } .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1.th-wetch-champion .thMicTrendPodiumAvatar { border: 3px solid var(--th-star-podium-rank-1-border,rgba(245,158,11,.75)); box-shadow: 0 0 18px var(--th-star-podium-glow,rgba(251,191,36,.35)) } .th-star-rank-list { flex: 1 1 auto; overflow-y: auto; min-height: 0; display: flex; flex-direction: column; gap: 8px; padding: 10px 8px 8px; position: relative; z-index: 2; border-radius: 18px; background: var(--th-star-panel-bg,linear-gradient(165deg,rgba(248,250,252,.72) 0,rgba(255,255,255,.58) 100%)); border: 1px solid var(--th-star-panel-border,rgba(148,163,184,.14)); box-shadow: inset 0 1px 0 rgba(255,255,255,.65); -webkit-overflow-scrolling: touch } .th-star-rank-list .th-star-rank-card { display: flex; align-items: center; gap: 10px; padding: 10px 11px; min-height: 58px; direction: ltr; border-radius: 16px; background: var(--th-star-surface-soft,linear-gradient(135deg,rgba(255,255,255,.98) 0,rgba(248,250,252,.92) 100%)); border: 1px solid var(--th-star-border,rgba(148,163,184,.14)); box-shadow: 0 4px 14px var(--th-star-glow,rgba(148,163,184,.1)); transition: transform .12s,box-shadow .12s,border-color .12s; --th-star-rank-bg: linear-gradient(145deg, var(--th-star-accent, #a78bfa), var(--th-star-accent-2, #8b5cf6)) } .th-star-rank-list .th-star-rank-card:active { transform: scale(.985); box-shadow: 0 2px 8px var(--th-star-glow) } .th-star-rank-list .th-star-rank-badge { width: 32px; height: 32px; min-width: 32px; font-size: 13px!important; font-weight: 900!important; color: var(--th-star-rank-color,#fff); background: var(--th-star-rank-bg); border: 1px solid rgba(255,255,255,.28); border-radius: 11px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; box-shadow: 0 3px 10px var(--th-star-badge-shadow,var(--th-star-glow,rgba(99,102,241,.14))); line-height: 1!important } .th-star-rank-list .th-star-rank-avatar-wrap { flex: 0 0 auto; padding: 2px; border-radius: 50%; background: linear-gradient(145deg,var(--th-star-accent),var(--th-star-accent-3),var(--th-star-accent-4)) } .th-star-rank-list .th-star-rank-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; display: block; border: 2px solid #fff; background-color: var(--th-star-avatar-bg,#f8fafc); background-size: 100% 100%; background-repeat: no-repeat; background-position: center center } .th-star-rank-list .th-star-rank-body { flex: 1 1 auto; min-width: 0; display: flex; align-items: center } .th-star-rank-list .th-star-rank-name { font-size: 13px!important; font-weight: 800!important; color: var(--th-star-name-color,#334155); line-height: 1.3!important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; direction: rtl; text-align: left } .th-star-rank-list .th-star-rank-score { flex: 0 0 auto; align-self: center; margin-left: 4px; font-size: 14px!important; font-weight: 800!important; color: var(--th-star-score-color,#64748b); background: var(--th-star-score-bg,linear-gradient(135deg,rgba(241,245,249,.9),rgba(226,232,240,.75))); border: 1px solid var(--th-star-score-border,var(--th-star-border,rgba(139,92,246,.14))); border-radius: 999px; padding: 4px 10px; line-height: 1.2!important; white-space: nowrap } .th-star-rank-list .th-star-rank-card[data-rank="10"],.th-star-rank-list .th-star-rank-card[data-rank="4"],.th-star-rank-list .th-star-rank-card[data-rank="7"] { --th-star-rank-bg: linear-gradient(145deg, var(--th-star-accent-4, #93c5fd), var(--th-star-accent-2, #818cf8)) } .th-star-rank-list .th-star-rank-card[data-rank="5"],.th-star-rank-list .th-star-rank-card[data-rank="8"] { --th-star-rank-bg: linear-gradient(145deg, var(--th-star-accent-3, #f9a8d4), var(--th-star-accent, #c4b5fd)) } .th-star-rank-list .th-star-rank-card[data-rank="6"],.th-star-rank-list .th-star-rank-card[data-rank="9"] { --th-star-rank-bg: linear-gradient(145deg, var(--th-star-accent, #c4b5fd), var(--th-star-accent-2, #a78bfa)) } #TH_LUDO_TREND_V3,#thLudoTrend.thMoreSubPane { --th-star-accent: #6ee7b7; --th-star-accent-2: #34d399; --th-star-accent-3: #5eead4; --th-star-accent-4: #a7f3d0; --th-star-surface-soft: linear-gradient(135deg, rgba(255, 255, 255, .98) 0%, rgba(236, 253, 245, .9) 55%, rgba(204, 251, 241, .84) 100%); --th-star-border: rgba(52, 211, 153, .14); --th-star-score-bg: linear-gradient(135deg, rgba(167, 243, 208, .42), rgba(153, 246, 228, .36)); --th-star-score-color: #059669; --th-star-score-border: rgba(52, 211, 153, .2); --th-star-name-color: #047857; --th-star-glow: rgba(52, 211, 153, .1); --th-star-badge-shadow: rgba(52, 211, 153, .16); --th-star-avatar-bg: #f0fdf4; --th-star-panel-bg: linear-gradient(165deg, rgba(236, 253, 245, .72) 0%, rgba(209, 250, 229, .56) 48%, rgba(204, 251, 241, .48) 100%); --th-star-panel-border: rgba(52, 211, 153, .16); --th-star-podium-rank-1-bg: linear-gradient(180deg, #ffffff 0%, #ecfdf5 52%, #a7f3d0 100%); --th-star-podium-rank-2-bg: linear-gradient(180deg, #ffffff 0%, #f0fdfa 100%); --th-star-podium-rank-3-bg: linear-gradient(180deg, #ffffff 0%, #fffbeb 100%); --th-star-podium-rank-1-border: rgba(52, 211, 153, .4); --th-star-podium-rank-2-border: rgba(45, 212, 191, .34); --th-star-podium-rank-3-border: rgba(253, 230, 138, .36); --th-star-podium-glow: rgba(52, 211, 153, .14) } #TH_LUDO_TREND_V3 .thLudoTrendWrap,#thLudoTrend .thLudoTrendWrap { padding: 0; height: calc(100% - 42px) } #TH_LUDO_TREND_V3 .th-ludo-trend-layout,#thLudoTrend .th-ludo-trend-layout { height: 100%; min-height: 0 } #TH_LUDO_TREND_V3 .th-wetch-top-wrap,#thLudoTrend .th-wetch-top-wrap { background: radial-gradient(circle at 88% 10%,rgba(52,211,153,.32) 0,transparent 40%),radial-gradient(circle at 10% 90%,rgba(20,184,166,.28) 0,transparent 38%),radial-gradient(circle at 50% 0,rgba(251,191,36,.18) 0,transparent 34%),linear-gradient(155deg,#064e3b 0,#047857 38%,#065f46 72%,#134e4a 100%); border-bottom: 1px solid rgba(52,211,153,.28); box-shadow: 0 14px 34px rgba(6,78,59,.22) } #TH_LUDO_TREND_V3 .th-wetch-top-title,#thLudoTrend .th-wetch-top-title { color: #a7f3d0; text-shadow: 0 2px 12px rgba(52,211,153,.32) } #TH_LUDO_TREND_V3 .th-wetch-top-wrap .thMicTrendTab,#thLudoTrend .th-wetch-top-wrap .thMicTrendTab { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.18); color: #ecfdf5 } #TH_LUDO_TREND_V3 .th-wetch-top-wrap .thMicTrendTab.is-active,#thLudoTrend .th-wetch-top-wrap .thMicTrendTab.is-active { background: linear-gradient(135deg,#34d399,#10b981); border-color: #6ee7b7; color: #fff; box-shadow: 0 6px 16px rgba(16,185,129,.34) } #TH_LUDO_TREND_V3 .th-ludo-trend-rest-wrap,#thLudoTrend .th-ludo-trend-rest-wrap { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding: 8px 10px 6px; background: radial-gradient(circle at 100% 0,rgba(52,211,153,.06) 0,transparent 42%),radial-gradient(circle at 0 100%,rgba(20,184,166,.07) 0,transparent 40%),linear-gradient(180deg,rgba(236,253,245,.55) 0,rgba(255,255,255,.35) 100%) } #TH_LUDO_TREND_V3 .th-wetch-feed-title,#thLudoTrend .th-wetch-feed-title { background: linear-gradient(90deg,#059669,#10b981,#14b8a6); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent } #TH_XO_TREND_V3 { --th-star-accent: #fdba74; --th-star-accent-2: #fb923c; --th-star-accent-3: #fda4af; --th-star-accent-4: #fde68a; --th-star-surface-soft: linear-gradient(135deg, rgba(255, 255, 255, .98) 0%, rgba(255, 247, 237, .9) 55%, rgba(255, 241, 242, .84) 100%); --th-star-border: rgba(251, 146, 60, .14); --th-star-score-bg: linear-gradient(135deg, rgba(254, 215, 170, .42), rgba(254, 205, 211, .34)); --th-star-score-color: #d97706; --th-star-score-border: rgba(251, 146, 60, .2); --th-star-name-color: #9a3412; --th-star-glow: rgba(251, 146, 60, .1); --th-star-badge-shadow: rgba(251, 146, 60, .16); --th-star-avatar-bg: #fff7ed; --th-star-panel-bg: linear-gradient(165deg, rgba(255, 247, 237, .72) 0%, rgba(254, 243, 199, .52) 48%, rgba(255, 241, 242, .48) 100%); --th-star-panel-border: rgba(251, 146, 60, .16); --th-star-podium-rank-1-bg: linear-gradient(180deg, #ffffff 0%, #fff7ed 52%, #fed7aa 100%); --th-star-podium-rank-2-bg: linear-gradient(180deg, #ffffff 0%, #fff1f2 100%); --th-star-podium-rank-3-bg: linear-gradient(180deg, #ffffff 0%, #fef9c3 100%); --th-star-podium-rank-1-border: rgba(251, 146, 60, .38); --th-star-podium-rank-2-border: rgba(251, 113, 133, .32); --th-star-podium-rank-3-border: rgba(253, 224, 71, .34); --th-star-podium-glow: rgba(251, 146, 60, .14) } #TH_XO_TREND_V3 .thXoTrendWrap { padding: 0; height: calc(100% - 42px) } #TH_XO_TREND_V3 .th-xo-trend-layout { height: 100%; min-height: 0 } #TH_XO_TREND_V3 .th-wetch-top-wrap { background: radial-gradient(circle at 88% 10%,rgba(59,130,246,.34) 0,transparent 40%),radial-gradient(circle at 10% 90%,rgba(249,115,22,.28) 0,transparent 38%),radial-gradient(circle at 50% 0,rgba(251,191,36,.18) 0,transparent 34%),linear-gradient(155deg,#1e3a8a 0,#1d4ed8 38%,#312e81 72%,#7c2d12 100%); border-bottom: 1px solid rgba(96,165,250,.28); box-shadow: 0 14px 34px rgba(30,58,138,.22) } #TH_XO_TREND_V3 .th-wetch-top-title { color: #bfdbfe; text-shadow: 0 2px 12px rgba(59,130,246,.32) } #TH_XO_TREND_V3 .th-wetch-top-wrap .thMicTrendTab { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.18); color: #eff6ff } #TH_XO_TREND_V3 .th-wetch-top-wrap .thMicTrendTab.is-active { background: linear-gradient(135deg,#60a5fa,#3b82f6); border-color: #93c5fd; color: #fff; box-shadow: 0 6px 16px rgba(59,130,246,.34) } #TH_XO_TREND_V3 .th-xo-trend-rest-wrap { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding: 8px 10px 6px; background: radial-gradient(circle at 100% 0,rgba(59,130,246,.06) 0,transparent 42%),radial-gradient(circle at 0 100%,rgba(249,115,22,.07) 0,transparent 40%),linear-gradient(180deg,rgba(239,246,255,.55) 0,rgba(255,255,255,.35) 100%) } #TH_XO_TREND_V3 .th-wetch-feed-title { background: linear-gradient(90deg,#2563eb,#3b82f6,#f97316); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent } #thXoTrend.thMoreSubPane { --th-star-accent: #a78bfa; --th-star-accent-2: #8b5cf6; --th-star-accent-3: #f0abfc; --th-star-accent-4: #818cf8; --th-star-surface-soft: linear-gradient(135deg, rgba(255, 255, 255, .98) 0%, rgba(237, 233, 254, .92) 55%, rgba(252, 231, 243, .78) 100%); --th-star-border: rgba(139, 92, 246, .14); --th-star-score-bg: linear-gradient(135deg, rgba(221, 214, 254, .48), rgba(251, 207, 232, .32)); --th-star-score-color: #6d28d9; --th-star-score-border: rgba(139, 92, 246, .2); --th-star-name-color: #5b21b6; --th-star-glow: rgba(139, 92, 246, .1); --th-star-badge-shadow: rgba(139, 92, 246, .14); --th-star-avatar-bg: #f5f3ff; --th-star-panel-bg: linear-gradient(165deg, rgba(237, 233, 254, .82) 0%, rgba(255, 255, 255, .62) 48%, rgba(252, 231, 243, .38) 100%); --th-star-panel-border: rgba(139, 92, 246, .14); --th-star-podium-rank-1-bg: linear-gradient(180deg, #ffffff 0%, #ede9fe 52%, #ddd6fe 100%); --th-star-podium-rank-2-bg: linear-gradient(180deg, #ffffff 0%, #eef2ff 100%); --th-star-podium-rank-3-bg: linear-gradient(180deg, #ffffff 0%, #fce7f3 100%); --th-star-podium-rank-1-border: rgba(139, 92, 246, .4); --th-star-podium-rank-2-border: rgba(129, 140, 248, .34); --th-star-podium-rank-3-border: rgba(244, 114, 182, .3); --th-star-podium-glow: rgba(139, 92, 246, .12) } #thXoTrend .thXoTrendWrap { background: var(--th-star-lux-bg,transparent)!important } #thXoTrend .th-wetch-top-wrap { box-shadow: 0 10px 24px rgba(67,56,202,.16) } #thXoTrend .th-wetch-top-title { color: #ede9fe } #thXoTrend .th-wetch-top-wrap .thMicTrendTab.is-active { background: linear-gradient(135deg,#c4b5fd,#8b5cf6); border-color: #ddd6fe; color: #fff; box-shadow: 0 4px 12px rgba(139,92,246,.26) } #thXoTrend .th-xo-trend-rest-wrap { flex: 1 1 auto; display: flex; flex-direction: column } #thXoTrend .th-wetch-feed-title { background: linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; font-size: 13px; margin-bottom: 6px } #thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem { box-shadow: 0 8px 18px rgba(15,23,42,.06) } #thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 { box-shadow: 0 0 22px var(--th-star-podium-glow),0 10px 22px rgba(15,23,42,.08) } #thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1.th-wetch-champion { box-shadow: 0 0 28px var(--th-star-podium-glow),0 12px 24px rgba(15,23,42,.1) } #thXoTrend .th-wetch-podium-arena .thMicTrendPodiumMedal { font-weight: 800 } #thXoTrend .th-wetch-podium-arena .thMicTrendPodiumName { font-weight: 800 } #thXoTrend .th-wetch-podium-arena .thMicTrendPodiumDuration { color: #6d28d9; font-weight: 800; background: rgba(255,255,255,.58); border: 1px solid rgba(139,92,246,.14) } #thXoTrend .th-star-rank-list { box-shadow: 0 4px 14px rgba(139,92,246,.06) } #thXoTrend .th-star-rank-list .th-star-rank-card { background: var(--th-star-surface-soft); box-shadow: 0 2px 8px rgba(15,23,42,.04) } #thXoTrend .th-star-rank-list .th-star-rank-name { color: var(--th-star-name-color); font-weight: 800 } #thXoTrend .th-star-rank-list .th-star-rank-score { color: var(--th-star-score-color); background: var(--th-star-score-bg); border: 1px solid var(--th-star-score-border); border-radius: 999px; font-weight: 800 } #thXoTrend .th-star-rank-list .th-star-rank-avatar { border: 2px solid rgba(139,92,246,.18); background: var(--th-star-avatar-bg) } #TH_TOP_V3 { --th-star-accent: #fbbf24; --th-star-accent-2: #f59e0b; --th-star-accent-3: #fde68a; --th-star-accent-4: #fdba74; --th-star-surface-soft: linear-gradient(135deg, rgba(255, 255, 255, .98) 0%, rgba(255, 251, 235, .92) 55%, rgba(254, 243, 199, .84) 100%); --th-star-border: rgba(251, 191, 36, .16); --th-star-score-bg: linear-gradient(135deg, rgba(254, 243, 199, .52), rgba(253, 230, 138, .38)); --th-star-score-color: #b45309; --th-star-score-border: rgba(245, 158, 11, .22); --th-star-name-color: #92400e; --th-star-glow: rgba(251, 191, 36, .1); --th-star-badge-shadow: rgba(245, 158, 11, .16); --th-star-avatar-bg: #fffbeb; --th-star-panel-bg: linear-gradient(165deg, rgba(255, 251, 235, .78) 0%, rgba(254, 243, 199, .52) 48%, rgba(255, 237, 213, .42) 100%); --th-star-panel-border: rgba(251, 191, 36, .18); --th-star-podium-rank-1-bg: linear-gradient(180deg, #ffffff 0%, #fffbeb 52%, #fde68a 100%); --th-star-podium-rank-2-bg: linear-gradient(180deg, #ffffff 0%, #fff7ed 100%); --th-star-podium-rank-3-bg: linear-gradient(180deg, #ffffff 0%, #ffedd5 100%); --th-star-podium-rank-1-border: rgba(245, 158, 11, .38); --th-star-podium-rank-2-border: rgba(251, 191, 36, .3); --th-star-podium-rank-3-border: rgba(253, 186, 116, .32); --th-star-podium-glow: rgba(251, 191, 36, .14) } #top10.thMoreSubPane { --th-star-lux-title: #fdf4ff; --th-star-lux-tab-active-bg: rgba(251, 191, 36, .88); --th-star-lux-tab-active-border: rgba(253, 224, 71, .55); --th-star-lux-tab-active-color: #78350f; --th-star-lux-r1-text: #fef3c7; --th-star-lux-r1-dur-color: #fffbeb; --th-star-lux-r1-dur-bg: rgba(251, 191, 36, .28); --th-star-lux-r1-dur-border: rgba(253, 224, 71, .35); --th-star-lux-r1-avatar-border: rgba(253, 224, 71, .65); --th-star-lux-r2-text: #eff6ff; --th-star-lux-r2-dur-color: #eff6ff; --th-star-lux-r2-dur-bg: rgba(147, 197, 253, .24); --th-star-lux-r2-dur-border: rgba(191, 219, 254, .32); --th-star-lux-r2-avatar-border: rgba(191, 219, 254, .65); --th-star-lux-r3-text: #fce7f3; --th-star-lux-r3-dur-color: #fce7f3; --th-star-lux-r3-dur-bg: rgba(244, 114, 182, .24); --th-star-lux-r3-dur-border: rgba(251, 207, 232, .32); --th-star-lux-r3-avatar-border: rgba(251, 207, 232, .65); --th-star-lux-badge-4: linear-gradient(145deg, #fde047, #eab308); --th-star-lux-badge-5: linear-gradient(145deg, #67e8f9, #0891b2); --th-star-lux-badge-6: linear-gradient(145deg, #f472b6, #db2777); --th-star-accent: #fbbf24; --th-star-accent-2: #38bdf8; --th-star-accent-3: #f472b6; --th-star-accent-4: #2dd4bf; --th-star-surface-soft: rgba(255, 255, 255, .16); --th-star-border: rgba(255, 255, 255, .2); --th-star-score-bg: rgba(255, 255, 255, .18); --th-star-score-color: #ecfeff; --th-star-score-border: rgba(255, 255, 255, .22); --th-star-name-color: #ffffff; --th-star-glow: transparent; --th-star-badge-shadow: transparent; --th-star-avatar-bg: rgba(255, 255, 255, .92); --th-star-panel-bg: transparent; --th-star-panel-border: transparent; --th-star-podium-rank-1-bg: rgba(251, 191, 36, .24); --th-star-podium-rank-2-bg: rgba(147, 197, 253, .2); --th-star-podium-rank-3-bg: rgba(244, 114, 182, .22); --th-star-podium-rank-1-border: rgba(253, 224, 71, .45); --th-star-podium-rank-2-border: rgba(191, 219, 254, .42); --th-star-podium-rank-3-border: rgba(251, 207, 232, .42); --th-star-podium-glow: transparent; --th-star-lux-bg: radial-gradient(circle at 12% 8%, rgba(244, 114, 182, .42) 0%, transparent 38%),radial-gradient(circle at 88% 14%, rgba(45, 212, 191, .34) 0%, transparent 36%),radial-gradient(circle at 50% 92%, rgba(139, 92, 246, .28) 0%, transparent 42%),linear-gradient(168deg, #5b21b6 0%, #9d174d 34%, #701a75 58%, #0f766e 100%); background: var(--th-star-lux-bg)!important } #TH_TOP_V3 .thCreatorTopWrap,#top10 .thCreatorTopWrap { padding: 0; height: calc(100% - 42px); width: 100%; box-sizing: border-box } #TH_TOP_V3 .th-creator-top-layout,#top10 .th-creator-top-layout { height: 100%; min-height: 0 } #top10 .th-creator-top-layout.th-wetch-layout { display: flex; flex-direction: column; height: 100% } #TH_TOP_V3 .th-wetch-top-wrap { background: radial-gradient(circle at 92% 8%,rgba(251,191,36,.14) 0,transparent 42%),radial-gradient(circle at 8% 92%,rgba(253,186,116,.12) 0,transparent 40%),linear-gradient(155deg,#fffdf7 0,#fff7ed 42%,#ffedd5 100%); border-bottom: 1px solid rgba(251,191,36,.2); box-shadow: 0 8px 22px rgba(245,158,11,.08) } #top10 .th-wetch-top-wrap { flex: 0 0 auto } #top10 .th-wetch-top-title { color: #fdf4ff } #top10 .th-wetch-podium-arena.thMicTrendPodium { align-items: flex-end; justify-content: stretch } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem { flex: 1 1 0 } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 { flex: 1.08 1 0 } #top10 .th-wetch-podium-arena .thMicTrendPodiumDuration { color: #fff; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.2) } #TH_TOP_V3 .th-wetch-top-wrap .thMicTrendTab { background: rgba(255,255,255,.72); border-color: rgba(251,191,36,.22); color: #a16207 } #TH_TOP_V3 .th-wetch-top-wrap .thMicTrendTab.is-active { background: linear-gradient(135deg,#fde68a,#fbbf24); border-color: #f59e0b; color: #92400e; box-shadow: 0 4px 12px rgba(245,158,11,.18) } #top10 .th-wetch-top-wrap .thMicTrendTab.is-active { background: rgba(251,191,36,.88); border-color: rgba(253,224,71,.55); color: #78350f } #TH_TOP_V3 .th-wetch-top-title { color: #b45309; text-shadow: none } #TH_TOP_V3 .th-creator-top-rest-wrap { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding: 8px 10px 6px; background: radial-gradient(circle at 100% 0,rgba(251,191,36,.06) 0,transparent 42%),radial-gradient(circle at 0 100%,rgba(253,186,116,.07) 0,transparent 40%),linear-gradient(180deg,rgba(255,251,235,.55) 0,rgba(255,255,255,.4) 100%) } #top10 .th-creator-top-rest-wrap { flex: 0 0 auto; display: flex; flex-direction: column } #top10 .th-creator-top-rest-wrap:has(.th-star-rank-list:not(:empty)) { flex: 1 1 auto; min-height: 0 } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem:only-child { flex: 0 1 auto } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem:only-child.th-wetch-champion { transform: none } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 { box-shadow: none!important } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumMedal,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumName { color: #fef3c7 } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumDuration { color: #fffbeb; background: rgba(251,191,36,.28); border: 1px solid rgba(253,224,71,.35) } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumMedal,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumName { color: #eff6ff } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumDuration { color: #eff6ff; background: rgba(147,197,253,.24); border: 1px solid rgba(191,219,254,.32) } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumMedal,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumName { color: #fce7f3 } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumDuration { color: #fce7f3; background: rgba(244,114,182,.24); border: 1px solid rgba(251,207,232,.32) } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar { border-color: rgba(191,219,254,.65) } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar { border-color: rgba(251,207,232,.65) } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar { border-color: rgba(253,224,71,.65) } #top10 .th-star-rank-list { flex: 1 1 auto } #top10 .th-star-rank-list .th-star-rank-card { box-sizing: border-box; --th-star-rank-bg: linear-gradient(145deg, rgba(148, 163, 184, .95), rgba(100, 116, 139, .95)) } #top10 .th-star-rank-list .th-star-rank-card[data-rank="10"],#top10 .th-star-rank-list .th-star-rank-card[data-rank="4"],#top10 .th-star-rank-list .th-star-rank-card[data-rank="7"] { --th-star-rank-bg: linear-gradient(145deg, #fde047, #eab308) } #top10 .th-star-rank-list .th-star-rank-card[data-rank="5"],#top10 .th-star-rank-list .th-star-rank-card[data-rank="8"] { --th-star-rank-bg: linear-gradient(145deg, #67e8f9, #0891b2) } #top10 .th-star-rank-list .th-star-rank-card[data-rank="6"],#top10 .th-star-rank-list .th-star-rank-card[data-rank="9"] { --th-star-rank-bg: linear-gradient(145deg, #f472b6, #db2777) } #TH_TOP_V3 .th-wetch-feed-title { background: linear-gradient(90deg,#d97706,#f59e0b,#fdba74); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent } @media (max-width: 360px) { #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar { width:54px; height: 54px } #top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar { width: 42px; height: 42px } #top10 .th-star-rank-list .th-star-rank-card { padding: 9px 10px; min-height: 50px; gap: 8px } #top10 .th-star-rank-list .th-star-rank-avatar { width: 36px; height: 36px } #top10 .th-star-rank-list .th-star-rank-badge { width: 30px; height: 30px; min-width: 30px } } #TH_MIC_TREND_V3,#thMicTrend.thMoreSubPane { --th-star-accent: #93c5fd; --th-star-accent-2: #60a5fa; --th-star-accent-3: #a5b4fc; --th-star-accent-4: #67e8f9; --th-star-surface-soft: linear-gradient(135deg, rgba(255, 255, 255, .98) 0%, rgba(239, 246, 255, .9) 55%, rgba(237, 233, 254, .84) 100%); --th-star-border: rgba(96, 165, 250, .14); --th-star-score-bg: linear-gradient(135deg, rgba(191, 219, 254, .42), rgba(165, 243, 252, .34)); --th-star-score-color: #3b82f6; --th-star-score-border: rgba(96, 165, 250, .2); --th-star-name-color: #1e40af; --th-star-glow: rgba(96, 165, 250, .1); --th-star-badge-shadow: rgba(96, 165, 250, .16); --th-star-avatar-bg: #eff6ff; --th-star-panel-bg: linear-gradient(165deg, rgba(239, 246, 255, .72) 0%, rgba(224, 231, 255, .56) 48%, rgba(237, 233, 254, .48) 100%); --th-star-panel-border: rgba(96, 165, 250, .16); --th-star-podium-rank-1-bg: linear-gradient(180deg, #ffffff 0%, #eff6ff 52%, #bfdbfe 100%); --th-star-podium-rank-2-bg: linear-gradient(180deg, #ffffff 0%, #ecfeff 100%); --th-star-podium-rank-3-bg: linear-gradient(180deg, #ffffff 0%, #ede9fe 100%); --th-star-podium-rank-1-border: rgba(96, 165, 250, .4); --th-star-podium-rank-2-border: rgba(103, 232, 249, .34); --th-star-podium-rank-3-border: rgba(167, 139, 250, .32); --th-star-podium-glow: rgba(96, 165, 250, .14) } #TH_MIC_TREND_V3 .thMicTrendWrap,#thMicTrend .thMicTrendWrap { padding: 0; height: calc(100% - 42px) } #TH_MIC_TREND_V3 .th-mic-trend-layout,#thMicTrend .th-mic-trend-layout { height: 100%; min-height: 0 } #TH_MIC_TREND_V3 .th-wetch-top-wrap,#thMicTrend .th-wetch-top-wrap { background: radial-gradient(circle at 88% 10%,rgba(14,165,233,.36) 0,transparent 40%),radial-gradient(circle at 10% 90%,rgba(124,58,237,.3) 0,transparent 38%),radial-gradient(circle at 50% 0,rgba(203,213,225,.24) 0,transparent 34%),linear-gradient(155deg,#0c4a6e 0,#1d4ed8 36%,#4c1d95 72%,#1e293b 100%); border-bottom: 1px solid rgba(125,211,252,.3); box-shadow: 0 14px 34px rgba(30,58,138,.24) } #TH_MIC_TREND_V3 .th-wetch-top-title,#thMicTrend .th-wetch-top-title { color: #bae6fd; text-shadow: 0 2px 12px rgba(14,165,233,.34) } #TH_MIC_TREND_V3 .th-wetch-top-wrap .thMicTrendTab,#thMicTrend .th-wetch-top-wrap .thMicTrendTab { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.18); color: #eff6ff } #TH_MIC_TREND_V3 .th-wetch-top-wrap .thMicTrendTab.is-active,#thMicTrend .th-wetch-top-wrap .thMicTrendTab.is-active { background: linear-gradient(135deg,#38bdf8,#2563eb); border-color: #93c5fd; color: #fff; box-shadow: 0 6px 16px rgba(37,99,235,.34) } #TH_MIC_TREND_V3 .th-mic-trend-rest-wrap,#thMicTrend .th-mic-trend-rest-wrap { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding: 8px 10px 6px; background: radial-gradient(circle at 100% 0,rgba(14,165,233,.07) 0,transparent 42%),radial-gradient(circle at 0 100%,rgba(124,58,237,.06) 0,transparent 40%),linear-gradient(180deg,rgba(239,246,255,.58) 0,rgba(255,255,255,.36) 100%) } #TH_MIC_TREND_V3 .th-wetch-feed-title,#thMicTrend .th-wetch-feed-title { background: linear-gradient(90deg,#2563eb,#0ea5e9,#7c3aed); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent } #TH_WETCH.th-wetch-panel,#TIGERHOST__LTD__WETCH__V3__.TIGERHOST_LTD__WETCH__X40DKDK3___V3 { --th-star-accent: #c4b5fd; --th-star-accent-2: #a78bfa; --th-star-accent-3: #f9a8d4; --th-star-accent-4: #93c5fd; --th-star-surface-soft: linear-gradient(135deg, rgba(255, 255, 255, .98) 0%, rgba(245, 243, 255, .9) 55%, rgba(253, 242, 248, .84) 100%); --th-star-border: rgba(167, 139, 250, .14); --th-star-score-bg: linear-gradient(135deg, rgba(233, 213, 255, .42), rgba(251, 207, 232, .34)); --th-star-score-color: #8b5cf6; --th-star-score-border: rgba(167, 139, 250, .2); --th-star-name-color: #6d28d9; --th-star-glow: rgba(167, 139, 250, .1); --th-star-badge-shadow: rgba(167, 139, 250, .16); --th-star-avatar-bg: #faf5ff; --th-star-panel-bg: linear-gradient(165deg, rgba(245, 243, 255, .72) 0%, rgba(238, 242, 255, .56) 48%, rgba(253, 242, 248, .48) 100%); --th-star-panel-border: rgba(167, 139, 250, .16); --th-star-podium-rank-1-bg: linear-gradient(180deg, #ffffff 0%, #f5f0ff 52%, #e9d5ff 100%); --th-star-podium-rank-2-bg: linear-gradient(180deg, #ffffff 0%, #eff6ff 100%); --th-star-podium-rank-3-bg: linear-gradient(180deg, #ffffff 0%, #fdf2f8 100%); --th-star-podium-rank-1-border: rgba(167, 139, 250, .42); --th-star-podium-rank-2-border: rgba(147, 197, 253, .34); --th-star-podium-rank-3-border: rgba(244, 114, 182, .3); --th-star-podium-glow: rgba(167, 139, 250, .14) } #thMicTrend.thMoreSubPane { --th-star-lux-title: #e0f2fe; --th-star-lux-tab-active-bg: rgba(56, 189, 248, .9); --th-star-lux-tab-active-border: rgba(125, 211, 252, .55); --th-star-lux-tab-active-color: #0c4a6e; --th-star-lux-r1-text: #e0f2fe; --th-star-lux-r1-dur-color: #f0f9ff; --th-star-lux-r1-dur-bg: rgba(56, 189, 248, .28); --th-star-lux-r1-dur-border: rgba(125, 211, 252, .35); --th-star-lux-r1-avatar-border: rgba(125, 211, 252, .65); --th-star-lux-r2-text: #dbeafe; --th-star-lux-r2-dur-color: #eff6ff; --th-star-lux-r2-dur-bg: rgba(147, 197, 253, .24); --th-star-lux-r2-dur-border: rgba(191, 219, 254, .32); --th-star-lux-r2-avatar-border: rgba(191, 219, 254, .65); --th-star-lux-r3-text: #ede9fe; --th-star-lux-r3-dur-color: #f5f3ff; --th-star-lux-r3-dur-bg: rgba(196, 181, 253, .24); --th-star-lux-r3-dur-border: rgba(221, 214, 254, .32); --th-star-lux-r3-avatar-border: rgba(196, 181, 253, .65); --th-star-lux-badge-4: linear-gradient(145deg, #fde047, #eab308); --th-star-lux-badge-5: linear-gradient(145deg, #67e8f9, #0891b2); --th-star-lux-badge-6: linear-gradient(145deg, #a78bfa, #7c3aed); --th-star-podium-rank-1-bg: rgba(56, 189, 248, .24); --th-star-podium-rank-2-bg: rgba(147, 197, 253, .2); --th-star-podium-rank-3-bg: rgba(196, 181, 253, .22); --th-star-podium-rank-1-border: rgba(125, 211, 252, .45); --th-star-podium-rank-2-border: rgba(191, 219, 254, .42); --th-star-podium-rank-3-border: rgba(221, 214, 254, .42); --th-star-podium-glow: transparent; --th-star-lux-bg: radial-gradient(circle at 12% 8%, rgba(56, 189, 248, .42) 0%, transparent 38%),radial-gradient(circle at 88% 14%, rgba(99, 102, 241, .36) 0%, transparent 36%),radial-gradient(circle at 50% 92%, rgba(14, 165, 233, .3) 0%, transparent 42%),linear-gradient(168deg, #0c4a6e 0%, #1e40af 34%, #312e81 58%, #164e63 100%); background: var(--th-star-lux-bg)!important } #thLudoTrend.thMoreSubPane { --th-star-lux-title: #d1fae5; --th-star-lux-tab-active-bg: rgba(52, 211, 153, .9); --th-star-lux-tab-active-border: rgba(110, 231, 183, .55); --th-star-lux-tab-active-color: #064e3b; --th-star-lux-r1-text: #ecfdf5; --th-star-lux-r1-dur-color: #f0fdf4; --th-star-lux-r1-dur-bg: rgba(52, 211, 153, .28); --th-star-lux-r1-dur-border: rgba(110, 231, 183, .35); --th-star-lux-r1-avatar-border: rgba(110, 231, 183, .65); --th-star-lux-r2-text: #ccfbf1; --th-star-lux-r2-dur-color: #f0fdfa; --th-star-lux-r2-dur-bg: rgba(45, 212, 191, .24); --th-star-lux-r2-dur-border: rgba(153, 246, 228, .32); --th-star-lux-r2-avatar-border: rgba(153, 246, 228, .65); --th-star-lux-r3-text: #fef9c3; --th-star-lux-r3-dur-color: #fefce8; --th-star-lux-r3-dur-bg: rgba(250, 204, 21, .22); --th-star-lux-r3-dur-border: rgba(253, 224, 71, .32); --th-star-lux-r3-avatar-border: rgba(253, 224, 71, .55); --th-star-lux-badge-4: linear-gradient(145deg, #fde047, #ca8a04); --th-star-lux-badge-5: linear-gradient(145deg, #2dd4bf, #0d9488); --th-star-lux-badge-6: linear-gradient(145deg, #86efac, #16a34a); --th-star-podium-rank-1-bg: rgba(52, 211, 153, .24); --th-star-podium-rank-2-bg: rgba(45, 212, 191, .2); --th-star-podium-rank-3-bg: rgba(250, 204, 21, .2); --th-star-podium-rank-1-border: rgba(110, 231, 183, .45); --th-star-podium-rank-2-border: rgba(153, 246, 228, .42); --th-star-podium-rank-3-border: rgba(253, 224, 71, .4); --th-star-podium-glow: transparent; --th-star-lux-bg: radial-gradient(circle at 12% 8%, rgba(52, 211, 153, .4) 0%, transparent 38%),radial-gradient(circle at 88% 14%, rgba(250, 204, 21, .28) 0%, transparent 36%),radial-gradient(circle at 50% 92%, rgba(20, 184, 166, .3) 0%, transparent 42%),linear-gradient(168deg, #064e3b 0%, #047857 34%, #14532d 58%, #365314 100%); background: var(--th-star-lux-bg)!important } #thXoTrend.thMoreSubPane { --th-star-lux-title: #e0f2fe; --th-star-lux-tab-active-bg: rgba(56, 189, 248, .88); --th-star-lux-tab-active-border: rgba(125, 211, 252, .55); --th-star-lux-tab-active-color: #082f49; --th-star-lux-r1-text: #e0f2fe; --th-star-lux-r1-dur-color: #f0f9ff; --th-star-lux-r1-dur-bg: rgba(56, 189, 248, .24); --th-star-lux-r1-dur-border: rgba(125, 211, 252, .35); --th-star-lux-r1-avatar-border: rgba(125, 211, 252, .65); --th-star-lux-r2-text: #ede9fe; --th-star-lux-r2-dur-color: #f5f3ff; --th-star-lux-r2-dur-bg: rgba(139, 92, 246, .22); --th-star-lux-r2-dur-border: rgba(196, 181, 253, .32); --th-star-lux-r2-avatar-border: rgba(196, 181, 253, .65); --th-star-lux-r3-text: #ccfbf1; --th-star-lux-r3-dur-color: #f0fdfa; --th-star-lux-r3-dur-bg: rgba(20, 184, 166, .20); --th-star-lux-r3-dur-border: rgba(94, 234, 212, .32); --th-star-lux-r3-avatar-border: rgba(94, 234, 212, .65); --th-star-lux-badge-4: linear-gradient(145deg, #38bdf8, #0284c7); --th-star-lux-badge-5: linear-gradient(145deg, #8b5cf6, #5b21b6); --th-star-lux-badge-6: linear-gradient(145deg, #14b8a6, #0f766e); --th-star-podium-rank-1-bg: rgba(56, 189, 248, .22); --th-star-podium-rank-2-bg: rgba(139, 92, 246, .20); --th-star-podium-rank-3-bg: rgba(20, 184, 166, .18); --th-star-podium-rank-1-border: rgba(125, 211, 252, .42); --th-star-podium-rank-2-border: rgba(196, 181, 253, .40); --th-star-podium-rank-3-border: rgba(94, 234, 212, .38); --th-star-podium-glow: transparent; --th-star-lux-bg: radial-gradient(circle at 12% 8%, rgba(56, 189, 248, .34) 0%, transparent 38%),radial-gradient(circle at 88% 14%, rgba(139, 92, 246, .30) 0%, transparent 36%),radial-gradient(circle at 50% 92%, rgba(20, 184, 166, .22) 0%, transparent 42%),linear-gradient(168deg, #082f49 0%, #0f172a 38%, #312e81 68%, #134e4a 100%); background: var(--th-star-lux-bg)!important } #TH_WETCH.th-wetch-panel { --th-star-lux-title: #fae8ff; --th-star-lux-tab-active-bg: rgba(244, 114, 182, .9); --th-star-lux-tab-active-border: rgba(251, 207, 232, .55); --th-star-lux-tab-active-color: #831843; --th-star-lux-r1-text: #fae8ff; --th-star-lux-r1-dur-color: #fdf4ff; --th-star-lux-r1-dur-bg: rgba(244, 114, 182, .28); --th-star-lux-r1-dur-border: rgba(251, 207, 232, .35); --th-star-lux-r1-avatar-border: rgba(251, 207, 232, .65); --th-star-lux-r2-text: #dbeafe; --th-star-lux-r2-dur-color: #eff6ff; --th-star-lux-r2-dur-bg: rgba(147, 197, 253, .24); --th-star-lux-r2-dur-border: rgba(191, 219, 254, .32); --th-star-lux-r2-avatar-border: rgba(191, 219, 254, .65); --th-star-lux-r3-text: #ccfbf1; --th-star-lux-r3-dur-color: #f0fdfa; --th-star-lux-r3-dur-bg: rgba(45, 212, 191, .24); --th-star-lux-r3-dur-border: rgba(153, 246, 228, .32); --th-star-lux-r3-avatar-border: rgba(153, 246, 228, .65); --th-star-lux-badge-4: linear-gradient(145deg, #f0abfc, #c026d3); --th-star-lux-badge-5: linear-gradient(145deg, #67e8f9, #0891b2); --th-star-lux-badge-6: linear-gradient(145deg, #a78bfa, #7c3aed); --th-star-podium-rank-1-bg: rgba(244, 114, 182, .24); --th-star-podium-rank-2-bg: rgba(147, 197, 253, .2); --th-star-podium-rank-3-bg: rgba(45, 212, 191, .22); --th-star-podium-rank-1-border: rgba(251, 207, 232, .45); --th-star-podium-rank-2-border: rgba(191, 219, 254, .42); --th-star-podium-rank-3-border: rgba(153, 246, 228, .42); --th-star-podium-glow: transparent; --th-star-lux-bg: radial-gradient(circle at 12% 8%, rgba(244, 114, 182, .4) 0%, transparent 38%),radial-gradient(circle at 88% 14%, rgba(167, 139, 250, .34) 0%, transparent 36%),radial-gradient(circle at 50% 92%, rgba(45, 212, 191, .28) 0%, transparent 42%),linear-gradient(168deg, #581c87 0%, #be185d 34%, #4338ca 58%, #0e7490 100%); background: var(--th-star-lux-bg)!important } #thLudoTrend .thLudoTrendWrap,#thMicTrend .thMicTrendWrap,#thXoTrend .thXoTrendWrap,#top10 .thCreatorTopWrap { padding: 0; height: calc(100% - 42px); width: 100%; box-sizing: border-box; background: var(--th-star-lux-bg,transparent)!important } #TH_WETCH.th-wetch-panel,#thLudoTrend.thMoreSubPane,#thMicTrend.thMoreSubPane,#thXoTrend.thMoreSubPane,#top10.thMoreSubPane { position: relative; box-sizing: border-box } #TH_WETCH.th-wetch-panel>.th-wetch-layout { background: var(--th-star-lux-bg,transparent)!important } #TH_WETCH.th-wetch-panel>.th-wetch-layout,#thLudoTrend .th-ludo-trend-layout.th-wetch-layout,#thMicTrend .th-mic-trend-layout.th-wetch-layout,#thXoTrend .th-xo-trend-layout.th-wetch-layout,#top10 .th-creator-top-layout.th-wetch-layout { display: flex; flex-direction: column; height: calc(100% - 42px); min-height: 0; padding-top: 16px; width: 100%; box-sizing: border-box } #thLudoTrend .th-ludo-trend-layout,#thMicTrend .th-mic-trend-layout,#thXoTrend .th-xo-trend-layout,#top10 .th-creator-top-layout { height: 100%; min-height: 0 } #TH_WETCH .th-wetch-top-wrap,#thLudoTrend .th-wetch-top-wrap,#thMicTrend .th-wetch-top-wrap,#thXoTrend .th-wetch-top-wrap,#top10 .th-wetch-top-wrap { flex: 0 0 auto; background: 0 0!important; border-bottom: 0!important; border-radius: 0; box-shadow: none!important; padding: 4px 4px 6px } #TH_WETCH .th-wetch-top-title,#thLudoTrend .th-wetch-top-title,#thMicTrend .th-wetch-top-title,#thXoTrend .th-wetch-top-title,#top10 .th-wetch-top-title { color: var(--th-star-lux-title,#fdf4ff); text-shadow: none!important; font-size: 14px; font-weight: 800; margin: 0 0 4px } #TH_WETCH .th-wetch-tabs,#thLudoTrend .th-wetch-tabs,#thMicTrend .th-wetch-tabs,#thXoTrend .th-wetch-tabs,#top10 .th-wetch-tabs { margin: 0 0 5px } #TH_WETCH .th-wetch-top,#thLudoTrend .th-wetch-top,#thMicTrend .th-wetch-top,#thXoTrend .th-wetch-top,#top10 .th-wetch-top { min-height: 0!important; height: auto; padding: 0 } #TH_WETCH .th-wetch-podium-arena.thMicTrendPodium,#thLudoTrend .th-wetch-podium-arena.thMicTrendPodium,#thMicTrend .th-wetch-podium-arena.thMicTrendPodium,#thXoTrend .th-wetch-podium-arena.thMicTrendPodium,#top10 .th-wetch-podium-arena.thMicTrendPodium { min-height: 0!important; height: auto; width: 100%; gap: 4px; padding: 9px 0 0; align-items: flex-end; justify-content: stretch } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem { flex: 1 1 0; max-width: none; min-width: 0; width: auto; min-height: 0!important; height: auto; padding: 4px 3px 6px; border-radius: 12px; box-shadow: none!important; border: 1px solid rgba(255,255,255,.2) } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1,#TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2,#TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 { min-height: 0!important; height: auto; box-shadow: none!important } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 { flex: 1.08 1 0; transform: translateY(-5px) } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1.th-wetch-champion,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1.th-wetch-champion,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1.th-wetch-champion,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1.th-wetch-champion,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1.th-wetch-champion { transform: translateY(-6px); box-shadow: none!important } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem:only-child,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem:only-child,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem:only-child,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem:only-child,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem:only-child { flex: 0 1 auto; max-width: 56%; margin: 0 auto; transform: none } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem:only-child.th-wetch-champion,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem:only-child.th-wetch-champion,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem:only-child.th-wetch-champion,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem:only-child.th-wetch-champion,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem:only-child.th-wetch-champion { transform: none } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumMedal,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumMedal,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumMedal,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumMedal,#top10 .th-wetch-podium-arena .thMicTrendPodiumMedal { font-size: 9px; margin-bottom: 2px; line-height: 1.2; color: rgba(255,255,255,.92) } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar { width: 58px; height: 58px; box-shadow: none; border-color: var(--th-star-lux-r1-avatar-border,rgba(253,224,71,.65)) } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar { width: 46px; height: 46px; box-shadow: none } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar { border-color: var(--th-star-lux-r2-avatar-border,rgba(191,219,254,.65)) } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar { border-color: var(--th-star-lux-r3-avatar-border,rgba(251,207,232,.65)) } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumName,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumName,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumName,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumName,#top10 .th-wetch-podium-arena .thMicTrendPodiumName { font-size: 11px; margin-top: 3px; line-height: 1.25; color: #fff } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumMedal,#TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumName,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumMedal,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumName,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumMedal,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumName,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumMedal,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumName,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumMedal,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumName { color: var(--th-star-lux-r1-text,#fef3c7) } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumMedal,#TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumName,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumMedal,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumName,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumMedal,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumName,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumMedal,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumName,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumMedal,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumName { color: var(--th-star-lux-r2-text,#eff6ff) } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumMedal,#TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumName,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumMedal,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumName,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumMedal,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumName,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumMedal,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumName,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumMedal,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumName { color: var(--th-star-lux-r3-text,#fce7f3) } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumDuration,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumDuration,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumDuration,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumDuration,#top10 .th-wetch-podium-arena .thMicTrendPodiumDuration { margin-top: 3px; padding: 2px 8px; font-size: 10px; border-radius: 999px; box-shadow: none } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumDuration,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumDuration,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumDuration,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumDuration,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumDuration { color: var(--th-star-lux-r1-dur-color,#fffbeb); background: var(--th-star-lux-r1-dur-bg,rgba(251,191,36,.28)); border: 1px solid var(--th-star-lux-r1-dur-border,rgba(253,224,71,.35)) } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumDuration,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumDuration,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumDuration,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumDuration,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumDuration { color: var(--th-star-lux-r2-dur-color,#eff6ff); background: var(--th-star-lux-r2-dur-bg,rgba(147,197,253,.24)); border: 1px solid var(--th-star-lux-r2-dur-border,rgba(191,219,254,.32)) } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumDuration,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumDuration,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumDuration,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumDuration,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumDuration { color: var(--th-star-lux-r3-dur-color,#fce7f3); background: var(--th-star-lux-r3-dur-bg,rgba(244,114,182,.24)); border: 1px solid var(--th-star-lux-r3-dur-border,rgba(251,207,232,.32)) } #TH_WETCH .th-wetch-top-wrap .thMicTrendTab,#thLudoTrend .th-wetch-top-wrap .thMicTrendTab,#thMicTrend .th-wetch-top-wrap .thMicTrendTab,#thXoTrend .th-wetch-top-wrap .thMicTrendTab,#top10 .th-wetch-top-wrap .thMicTrendTab { background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.22); color: rgba(255,255,255,.88); font-size: 12px; padding: 6px 10px; box-shadow: none!important } #TH_WETCH .th-wetch-top-wrap .thMicTrendTab.is-active,#thLudoTrend .th-wetch-top-wrap .thMicTrendTab.is-active,#thMicTrend .th-wetch-top-wrap .thMicTrendTab.is-active,#thXoTrend .th-wetch-top-wrap .thMicTrendTab.is-active,#top10 .th-wetch-top-wrap .thMicTrendTab.is-active { background: var(--th-star-lux-tab-active-bg,rgba(251,191,36,.88)); border-color: var(--th-star-lux-tab-active-border,rgba(253,224,71,.55)); color: var(--th-star-lux-tab-active-color,#78350f); box-shadow: none!important } #TH_WETCH .th-wetch-feed-wrap,#thLudoTrend .th-ludo-trend-rest-wrap,#thMicTrend .th-mic-trend-rest-wrap,#thXoTrend .th-xo-trend-rest-wrap,#top10 .th-creator-top-rest-wrap { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding: 5px 3px 6px; margin-top: 0; border-top: 1px solid rgba(255,255,255,.18); background: 0 0!important; position: relative } #TH_WETCH .th-wetch-feed-wrap:has(#TH_WETCH_REST:not(:empty)),#TH_WETCH .th-wetch-feed-wrap:has(.th-wetch-list:not(:empty)),#thLudoTrend .th-ludo-trend-rest-wrap:has(.th-star-rank-list:not(:empty)),#thMicTrend .th-mic-trend-rest-wrap:has(.th-star-rank-list:not(:empty)),#thXoTrend .th-xo-trend-rest-wrap:has(.th-star-rank-list:not(:empty)),#top10 .th-creator-top-rest-wrap:has(.th-star-rank-list:not(:empty)) { flex: 1 1 auto; min-height: 0 } #thLudoTrend .th-wetch-feed-title,#thMicTrend .th-wetch-feed-title,#thXoTrend .th-wetch-feed-title,#top10 .th-wetch-feed-title { display: none } #TH_WETCH .th-wetch-feed-title { color: rgba(255,255,255,.86); font-size: 12px; font-weight: 800; margin: 0 0 4px; padding: 0 3px; background: 0 0!important; -webkit-text-fill-color: currentColor } #TH_WETCH .th-wetch-top-empty,#thLudoTrend .th-wetch-top-empty,#thMicTrend .th-wetch-top-empty,#thXoTrend .th-wetch-top-empty,#top10 .th-wetch-top-empty { color: rgba(255,255,255,.82) } #TH_WETCH #TH_WETCH_REST.th-star-rank-list,#TH_WETCH .th-star-rank-list,#thLudoTrend .th-star-rank-list,#thMicTrend .th-star-rank-list,#thXoTrend .th-star-rank-list,#top10 .th-star-rank-list { flex: 1 1 auto; min-height: 0; width: 100%; gap: 6px; padding: 0 1px 2px; border-radius: 0; background: 0 0!important; border: 0!important; box-shadow: none!important } #TH_WETCH #TH_WETCH_REST .th-star-rank-card,#TH_WETCH .th-star-rank-list .th-star-rank-card,#thLudoTrend .th-star-rank-list .th-star-rank-card,#thMicTrend .th-star-rank-list .th-star-rank-card,#thXoTrend .th-star-rank-list .th-star-rank-card,#top10 .th-star-rank-list .th-star-rank-card { width: 100%; box-sizing: border-box; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.18); box-shadow: none!important; padding: 10px 12px; min-height: 52px; border-radius: 999px; --th-star-rank-bg: linear-gradient(145deg, rgba(148, 163, 184, .95), rgba(100, 116, 139, .95)) } #TH_WETCH #TH_WETCH_REST .th-star-rank-card:active,#TH_WETCH .th-star-rank-list .th-star-rank-card:active,#thLudoTrend .th-star-rank-list .th-star-rank-card:active,#thMicTrend .th-star-rank-list .th-star-rank-card:active,#thXoTrend .th-star-rank-list .th-star-rank-card:active,#top10 .th-star-rank-list .th-star-rank-card:active { transform: none; box-shadow: none!important } #TH_WETCH #TH_WETCH_REST .th-star-rank-card[data-rank="10"],#TH_WETCH #TH_WETCH_REST .th-star-rank-card[data-rank="4"],#TH_WETCH #TH_WETCH_REST .th-star-rank-card[data-rank="7"],#TH_WETCH .th-star-rank-list .th-star-rank-card[data-rank="10"],#TH_WETCH .th-star-rank-list .th-star-rank-card[data-rank="4"],#TH_WETCH .th-star-rank-list .th-star-rank-card[data-rank="7"],#thLudoTrend .th-star-rank-list .th-star-rank-card[data-rank="10"],#thLudoTrend .th-star-rank-list .th-star-rank-card[data-rank="4"],#thLudoTrend .th-star-rank-list .th-star-rank-card[data-rank="7"],#thMicTrend .th-star-rank-list .th-star-rank-card[data-rank="10"],#thMicTrend .th-star-rank-list .th-star-rank-card[data-rank="4"],#thMicTrend .th-star-rank-list .th-star-rank-card[data-rank="7"],#thXoTrend .th-star-rank-list .th-star-rank-card[data-rank="10"],#thXoTrend .th-star-rank-list .th-star-rank-card[data-rank="4"],#thXoTrend .th-star-rank-list .th-star-rank-card[data-rank="7"],#top10 .th-star-rank-list .th-star-rank-card[data-rank="10"],#top10 .th-star-rank-list .th-star-rank-card[data-rank="4"],#top10 .th-star-rank-list .th-star-rank-card[data-rank="7"] { --th-star-rank-bg: var(--th-star-lux-badge-4, linear-gradient(145deg, #fde047, #eab308)) } #TH_WETCH #TH_WETCH_REST .th-star-rank-card[data-rank="5"],#TH_WETCH #TH_WETCH_REST .th-star-rank-card[data-rank="8"],#TH_WETCH .th-star-rank-list .th-star-rank-card[data-rank="5"],#TH_WETCH .th-star-rank-list .th-star-rank-card[data-rank="8"],#thLudoTrend .th-star-rank-list .th-star-rank-card[data-rank="5"],#thLudoTrend .th-star-rank-list .th-star-rank-card[data-rank="8"],#thMicTrend .th-star-rank-list .th-star-rank-card[data-rank="5"],#thMicTrend .th-star-rank-list .th-star-rank-card[data-rank="8"],#thXoTrend .th-star-rank-list .th-star-rank-card[data-rank="5"],#thXoTrend .th-star-rank-list .th-star-rank-card[data-rank="8"],#top10 .th-star-rank-list .th-star-rank-card[data-rank="5"],#top10 .th-star-rank-list .th-star-rank-card[data-rank="8"] { --th-star-rank-bg: var(--th-star-lux-badge-5, linear-gradient(145deg, #67e8f9, #0891b2)) } #TH_WETCH #TH_WETCH_REST .th-star-rank-card[data-rank="6"],#TH_WETCH #TH_WETCH_REST .th-star-rank-card[data-rank="9"],#TH_WETCH .th-star-rank-list .th-star-rank-card[data-rank="6"],#TH_WETCH .th-star-rank-list .th-star-rank-card[data-rank="9"],#thLudoTrend .th-star-rank-list .th-star-rank-card[data-rank="6"],#thLudoTrend .th-star-rank-list .th-star-rank-card[data-rank="9"],#thMicTrend .th-star-rank-list .th-star-rank-card[data-rank="6"],#thMicTrend .th-star-rank-list .th-star-rank-card[data-rank="9"],#thXoTrend .th-star-rank-list .th-star-rank-card[data-rank="6"],#thXoTrend .th-star-rank-list .th-star-rank-card[data-rank="9"],#top10 .th-star-rank-list .th-star-rank-card[data-rank="6"],#top10 .th-star-rank-list .th-star-rank-card[data-rank="9"] { --th-star-rank-bg: var(--th-star-lux-badge-6, linear-gradient(145deg, #f472b6, #db2777)) } #TH_WETCH #TH_WETCH_REST .th-star-rank-badge,#TH_WETCH .th-star-rank-list .th-star-rank-badge,#thLudoTrend .th-star-rank-list .th-star-rank-badge,#thMicTrend .th-star-rank-list .th-star-rank-badge,#thXoTrend .th-star-rank-list .th-star-rank-badge,#top10 .th-star-rank-list .th-star-rank-badge { width: 32px; height: 32px; min-width: 32px; border-radius: 50%; box-shadow: none!important; border: 1px solid rgba(255,255,255,.24) } #TH_WETCH #TH_WETCH_REST .th-star-rank-avatar-wrap,#TH_WETCH .th-star-rank-list .th-star-rank-avatar-wrap,#thLudoTrend .th-star-rank-list .th-star-rank-avatar-wrap,#thMicTrend .th-star-rank-list .th-star-rank-avatar-wrap,#thXoTrend .th-star-rank-list .th-star-rank-avatar-wrap,#top10 .th-star-rank-list .th-star-rank-avatar-wrap { background: rgba(255,255,255,.22); padding: 2px } #TH_WETCH #TH_WETCH_REST .th-star-rank-avatar,#TH_WETCH .th-star-rank-list .th-star-rank-avatar,#thLudoTrend .th-star-rank-list .th-star-rank-avatar,#thMicTrend .th-star-rank-list .th-star-rank-avatar,#thXoTrend .th-star-rank-list .th-star-rank-avatar,#top10 .th-star-rank-list .th-star-rank-avatar { width: 40px; height: 40px } #TH_WETCH #TH_WETCH_REST .th-star-rank-name,#TH_WETCH .th-star-rank-list .th-star-rank-name,#thLudoTrend .th-star-rank-list .th-star-rank-name,#thMicTrend .th-star-rank-list .th-star-rank-name,#thXoTrend .th-star-rank-list .th-star-rank-name,#top10 .th-star-rank-list .th-star-rank-name { font-size: 13px!important; color: #fff!important } #TH_WETCH #TH_WETCH_REST .th-star-rank-score,#TH_WETCH .th-star-rank-list .th-star-rank-score,#thLudoTrend .th-star-rank-list .th-star-rank-score,#thMicTrend .th-star-rank-list .th-star-rank-score,#thXoTrend .th-star-rank-list .th-star-rank-score,#top10 .th-star-rank-list .th-star-rank-score { box-shadow: none!important; padding: 4px 10px; color: #ecfeff; background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.22) } #TH_WETCH .th-wetch-item { border-radius: 999px } #TH_WETCH .th-wetch-item.th-wetch-feed-card::before { display: none } #TH_WETCH .th-wetch-item-name,#TH_WETCH .th-wetch-item-name .u-topic { border-radius: 5px; color: #2020c0!important } #TH_WETCH .th-wetch-item-msg,#TH_WETCH .th-wetch-item-time { color: rgb(126 84 156)!important } .notification__sender__name .username { border-radius: 5px } #TH_WETCH .th-wetch-item-avatar { border-color: rgba(255,255,255,.35)!important; box-shadow: none!important } #TH_WETCH #TH_WETCH_EMPTY .thWetchEmptyTitle,#TH_WETCH #TH_WETCH_EMPTY.thWetchEmpty { color: rgba(255,255,255,.88) } #TH_WETCH #TH_WETCH_EMPTY .thWetchEmptySub { color: rgba(255,255,255,.62) } #TH_WETCH #TH_WETCH_EMPTY.thWetchEmpty { position: absolute; top: auto; bottom: 10px; left: 6px; right: 6px; display: flex; align-items: center; justify-content: center; pointer-events: none; z-index: 1; padding: 0 } @media (max-width: 360px) { #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-1 .thMicTrendPodiumAvatar { width:54px; height: 54px } #TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#TH_WETCH .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#thLudoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#thMicTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#thXoTrend .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar,#top10 .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar { width: 42px; height: 42px } #TH_WETCH #TH_WETCH_REST .th-star-rank-card,#TH_WETCH .th-star-rank-list .th-star-rank-card,#thLudoTrend .th-star-rank-list .th-star-rank-card,#thMicTrend .th-star-rank-list .th-star-rank-card,#thXoTrend .th-star-rank-list .th-star-rank-card,#top10 .th-star-rank-list .th-star-rank-card { padding: 9px 10px; min-height: 50px; gap: 8px } #TH_WETCH #TH_WETCH_REST .th-star-rank-avatar,#TH_WETCH .th-star-rank-list .th-star-rank-avatar,#thLudoTrend .th-star-rank-list .th-star-rank-avatar,#thMicTrend .th-star-rank-list .th-star-rank-avatar,#thXoTrend .th-star-rank-list .th-star-rank-avatar,#top10 .th-star-rank-list .th-star-rank-avatar { width: 36px; height: 36px } #TH_WETCH #TH_WETCH_REST .th-star-rank-badge,#TH_WETCH .th-star-rank-list .th-star-rank-badge,#thLudoTrend .th-star-rank-list .th-star-rank-badge,#thMicTrend .th-star-rank-list .th-star-rank-badge,#thXoTrend .th-star-rank-list .th-star-rank-badge,#top10 .th-star-rank-list .th-star-rank-badge { width: 30px; height: 30px; min-width: 30px } } .th-wetch-rest-list.th-star-rank-list { margin-top: 2px } .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 { border-color: var(--th-star-podium-rank-2-border,rgba(129,140,248,.55)); background: var(--th-star-podium-rank-2-bg,linear-gradient(180deg,#fff 0,#e0e7ff 100%)); box-shadow: 0 10px 22px var(--th-star-podium-glow,rgba(99,102,241,.14)) } .th-wetch-podium-arena .thMicTrendPodiumItem.rank-2 .thMicTrendPodiumAvatar { border-color: var(--th-star-podium-rank-2-border,#818cf8) } .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 { border-color: var(--th-star-podium-rank-3-border,rgba(244,114,182,.48)); background: var(--th-star-podium-rank-3-bg,linear-gradient(180deg,#fff5fb 0,#fce7f3 100%)); box-shadow: 0 10px 22px var(--th-star-podium-glow,rgba(236,72,153,.12)) } .th-wetch-podium-arena .thMicTrendPodiumItem.rank-3 .thMicTrendPodiumAvatar { border-color: var(--th-star-podium-rank-3-border,#f472b6) } .th-wetch-podium-arena .thMicTrendPodiumMedal,.th-wetch-podium-arena .thMicTrendPodiumName { color: #0f172a } .th-wetch-podium-arena .thMicTrendPodiumDuration { color: #475569; font-weight: 800 } .th-wetch-top-wrap .thMicTrendTab { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.18); color: #e2e8f0 } .th-wetch-top-wrap .thMicTrendTab.is-active { background: linear-gradient(135deg,#a78bfa,#8b5cf6); border-color: #c4b5fd; color: #fff; box-shadow: 0 6px 16px rgba(139,92,246,.34) } .th-wetch-podium-row { display: flex; align-items: flex-end; justify-content: center; gap: 10px; margin-bottom: 6px } .th-wetch-podium-row-extra,.th-wetch-podium-row-sub { align-items: center; margin-top: 4px } .th-wetch-slot { display: flex; flex-direction: column; align-items: center; width: 72px; min-width: 0 } .th-wetch-slot-hero { width: 84px; margin-bottom: 2px } .th-wetch-slot-mini { width: 58px } .th-wetch-rank-badge { font-size: 10px; font-weight: 800; line-height: 18px; min-width: 18px; height: 18px; text-align: center; color: #fff; border-radius: 999px; margin-bottom: 4px; padding: 0 5px } .th-wetch-rank-4 .th-wetch-rank-badge:not(.th-wetch-rank-medal) { background: rgba(99,102,241,.9); border: 1px solid rgba(99,102,241,.35); box-shadow: 0 1px 4px rgba(99,102,241,.2) } .th-wetch-rank-5 .th-wetch-rank-badge:not(.th-wetch-rank-medal) { background: rgba(139,92,246,.9); border: 1px solid rgba(139,92,246,.35); box-shadow: 0 1px 4px rgba(139,92,246,.2) } .th-wetch-rank-6 .th-wetch-rank-badge:not(.th-wetch-rank-medal) { background: rgba(236,72,153,.9); border: 1px solid rgba(236,72,153,.35); box-shadow: 0 1px 4px rgba(236,72,153,.2) } .th-wetch-rank-7 .th-wetch-rank-badge:not(.th-wetch-rank-medal) { background: rgba(20,184,166,.9); border: 1px solid rgba(20,184,166,.35); box-shadow: 0 1px 4px rgba(20,184,166,.2) } .th-wetch-rank-8 .th-wetch-rank-badge:not(.th-wetch-rank-medal) { background: rgba(14,165,233,.9); border: 1px solid rgba(14,165,233,.35); box-shadow: 0 1px 4px rgba(14,165,233,.2) } .th-wetch-rank-9 .th-wetch-rank-badge:not(.th-wetch-rank-medal) { background: rgba(16,185,129,.9); border: 1px solid rgba(16,185,129,.35); box-shadow: 0 1px 4px rgba(16,185,129,.2) } .th-wetch-rank-10 .th-wetch-rank-badge:not(.th-wetch-rank-medal) { background: rgba(249,115,22,.9); border: 1px solid rgba(249,115,22,.35); box-shadow: 0 1px 4px rgba(249,115,22,.2) } .th-wetch-slot-hero .th-wetch-rank-badge { background: linear-gradient(135deg,#f59e0b,#d97706); border-color: rgba(217,119,6,.35); color: #fff; box-shadow: 0 1px 4px rgba(217,119,6,.22) } .th-wetch-rank-2 .th-wetch-rank-badge { background: linear-gradient(135deg,#94a3b8,#64748b); border-color: rgba(100,116,139,.35); box-shadow: 0 1px 4px rgba(100,116,139,.2) } .th-wetch-rank-3 .th-wetch-rank-badge { background: linear-gradient(135deg,#d97706,#b45309); border-color: rgba(180,83,9,.35); box-shadow: 0 1px 4px rgba(180,83,9,.2) } .th-wetch-rank-badge.th-wetch-rank-medal { background: 0 0!important; border: none!important; box-shadow: none!important; font-size: 17px; line-height: 1; min-width: auto; height: auto; padding: 0; margin-bottom: 3px; color: inherit } .th-wetch-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; border: 2px solid #fff; box-shadow: 0 2px 10px rgba(0,0,0,.18); margin-bottom: 4px; background-size: 100% 100%; background-repeat: no-repeat; background-position: center center } .th-wetch-slot-hero .th-wetch-avatar { width: 58px; height: 58px; border-width: 3px } .th-wetch-slot-podium .th-wetch-avatar { width: 46px; height: 46px } .th-wetch-slot-mini .th-wetch-avatar { width: 38px; height: 38px } .th-wetch-slot-name { font-size: 11px; font-weight: 800; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff; margin-bottom: 2px } .th-wetch-slot-mini .th-wetch-slot-name { color: rgba(91,33,182,.78)!important } .th-wetch-rank-4 .th-wetch-slot-name { color: rgba(67,56,202,.88)!important } .th-wetch-rank-5 .th-wetch-slot-name { color: rgba(109,40,217,.88)!important } .th-wetch-rank-6 .th-wetch-slot-name { color: rgba(190,24,93,.88)!important } .th-wetch-rank-7 .th-wetch-slot-name { color: rgba(15,118,110,.88)!important } .th-wetch-rank-8 .th-wetch-slot-name { color: rgba(2,132,199,.88)!important } .th-wetch-rank-9 .th-wetch-slot-name { color: rgba(5,150,105,.88)!important } .th-wetch-rank-10 .th-wetch-slot-name { color: rgba(194,65,12,.88)!important } .th-wetch-slot-count { font-size: 10px; font-weight: 800; color: rgba(91,33,182,.82); background: rgba(255,255,255,.78); border: 1px dashed rgba(139,92,246,.38); border-radius: 8px; padding: 2px 8px; line-height: 16px; min-width: 28px; text-align: center } .th-wetch-feed-wrap { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding-top: 5px; position: relative; background: radial-gradient(circle at 92% 6%,rgba(236,72,153,.1) 0,transparent 44%),radial-gradient(circle at 6% 94%,rgba(99,102,241,.1) 0,transparent 42%),radial-gradient(circle at 50% 50%,rgba(251,191,36,.05) 0,transparent 55%),linear-gradient(180deg,rgba(250,245,255,.72) 0,rgba(255,255,255,.48) 100%); border-top: 1px solid rgba(167,139,250,.14) } #TH_WETCH_EMPTY.thWetchEmpty { position: absolute; top: auto; bottom: 10px; left: 8px; right: 8px; display: flex; align-items: center; justify-content: center; pointer-events: none; z-index: 1; padding: 0 } #TH_WETCH_EMPTY .thWetchEmptyCenter { width: 100%; max-width: 100%; text-align: center; padding: 26px 18px 22px; border-radius: 22px; background: linear-gradient(155deg,rgba(255,255,255,.97) 0,rgba(245,243,255,.94) 48%,rgba(253,242,248,.9) 100%); border: 1px solid rgba(139,92,246,.2); box-shadow: 0 14px 34px rgba(139,92,246,.14),0 4px 14px rgba(236,72,153,.08),inset 0 1px 0 rgba(255,255,255,.88); position: relative; overflow: hidden } #TH_WETCH_EMPTY .thWetchEmptyCenter::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg,#8b5cf6,#6366f1,#ec4899,#38bdf8); opacity: .82 } #TH_WETCH_EMPTY .thWetchEmptyCenter::after { content: ''; position: absolute; inset: auto -30px -40px auto; width: 120px; height: 120px; border-radius: 50%; background: radial-gradient(circle,rgba(167,139,250,.18) 0,transparent 70%); pointer-events: none } #TH_WETCH_EMPTY .thWetchEmptyIcon { width: 88px; height: 88px; margin: 0 auto 16px; border-radius: 999px; background: linear-gradient(145deg,rgba(139,92,246,.2),rgba(236,72,153,.14)); display: flex; align-items: center; justify-content: center; font-size: 34px; color: #7c3aed; border: 2px solid rgba(167,139,250,.34); box-shadow: 0 0 26px rgba(139,92,246,.22),inset 0 0 18px rgba(255,255,255,.45); position: relative; z-index: 1 } #TH_WETCH_EMPTY .thWetchEmptyTitle { font-size: 16px; font-weight: 900; margin: 0 0 8px; letter-spacing: .2px; background: linear-gradient(90deg,#5b21b6,#7c3aed,#be185d); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; position: relative; z-index: 1 } #TH_WETCH_EMPTY .thWetchEmptySub { font-size: 13px; font-weight: 700; line-height: 1.55; color: rgba(91,33,182,.62)!important; margin: 0 auto; max-width: 92%; position: relative; z-index: 1 } .th-wetch-list { flex: 1 1 auto; overflow-y: auto; min-height: 0; background: 0 0; border-radius: 16px; box-shadow: none; height: auto!important; position: relative; z-index: 2; padding: 2px 2px 4px; display: flex; flex-direction: column; align-items: stretch; gap: 8px; -webkit-overflow-scrolling: touch } .th-wetch-item { display: flex; align-items: center; gap: 11px; width: 100%; box-sizing: border-box; flex: 0 0 auto; flex-shrink: 0; min-height: 58px; padding: 11px 12px; border-radius: 16px; margin-bottom: 0; transition: transform .12s,box-shadow .12s } .th-wetch-item:active { transform: scale(.985); box-shadow: 0 2px 8px rgba(139,92,246,.1) } .th-wetch-item.th-wetch-feed-card { background: linear-gradient(135deg,#fff 0,#f6f4ff 48%,#ffe4f5 100%); border: 1px solid rgba(167,139,250,.22); box-shadow: 0 6px 18px rgba(99,102,241,.12); position: relative; overflow: hidden } .th-wetch-item.th-wetch-feed-card::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 4px; background: linear-gradient(180deg,#ec4899,#8b5cf6,#38bdf8); border-radius: 16px 0 0 16px; opacity: .9 } .th-wetch-item-badge.th-wetch-item-badge-glow { color: #7e22ce; background: linear-gradient(135deg,rgba(237,233,254,.98),rgba(252,231,243,.92)); border-color: rgba(167,139,250,.32) } .th-wetch-item-avatar { width: 46px; height: 46px; min-width: 46px; min-height: 46px; max-width: 46px; max-height: 46px; flex: 0 0 46px; -webkit-flex: 0 0 46px; display: block; border-radius: 50%; object-fit: cover; border: 2px solid rgba(167,139,250,.45); box-shadow: 0 3px 10px rgba(139,92,246,.14); background-size: 100% 100%; background-repeat: no-repeat; background-position: center center } .th-wetch-item-body { flex: 1 1 auto; min-width: 0 } .th-wetch-item-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 3px } .th-wetch-item-name { display: inline-flex; align-items: center; gap: 4px; min-width: 0; font-size: 13px; font-weight: 800 } .th-wetch-item-name .u-topic { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 140px; border-radius: 6px; padding: 0 4px } .th-wetch-item-time { font-size: 11px!important; font-weight: 700; color: rgba(17,24,39,.45); flex: 0 0 auto } .th-wetch-item-msg { font-size: 12px; font-weight: 700; color: rgba(30,27,75,.68); line-height: 1.45 } .th-wetch-item-badge { flex: 0 0 auto; font-size: 10px; font-weight: 800; color: #7c3aed; background: linear-gradient(135deg,rgba(237,233,254,.95),rgba(219,234,254,.88)); border: 1px solid rgba(139,92,246,.22); border-radius: 999px; padding: 5px 9px; line-height: 1 } @media (max-width: 360px) { .th-star-rank-list .th-star-rank-card { gap:8px; padding: 9px; min-height: 54px } .th-star-rank-list .th-star-rank-avatar { width: 36px; height: 36px } .th-star-rank-list .th-star-rank-badge { width: 28px; height: 28px; min-width: 28px; font-size: 12px } .th-star-rank-list .th-star-rank-name { font-size: 12px } .th-wetch-item-avatar { width: 42px; height: 42px } } .th-story-comments-modal { display: none; position: fixed; top: 5%; left: 5%; width: 90%; height: 90%; background: #222; color: #fff; z-index: 999999999; border-radius: 8px; overflow: hidden; box-shadow: 0 0 15px rgba(0,0,0,.7) } .th-story-comments-head { padding: 10px; background: #111; display: flex; justify-content: space-between; align-items: center } .th-story-comments-title { margin: 0 } .th-story-comments-close { background: 0 0; border: none; color: #fff; font-size: 20px; cursor: pointer } .th-story-comments-container { overflow-y: auto; height: calc(100% - 120px); padding: 10px } .th-story-comments-footer { padding: 10px; background: #111; display: flex; gap: 10px; align-items: center } .th-story-comments-input { flex: 1; padding: 8px; border-radius: 5px; border: none } .th-story-comments-send { background: #4caf50; border: none; color: #fff; padding: 8px 15px; border-radius: 5px; cursor: pointer } .th-irpl-item { border-bottom: 1px solid #e6e6fa; margin: 0; width: 100%; padding: 0 0 0 2px; border-radius: 0!important } .th-irpl-pic { min-width: 52px; width: 52px; height: 46px; background-color: #f3f3f3; background-image: url("pic.png") } .th-irpl-body { padding-top: 1px; padding-left: 1px } .th-irpl-head { width: 100%; display: flex; height: 21px } .th-irpl-user { overflow: hidden } .th-irpl-topic { padding: 1px 4px; display: block; margin-left: 1px; border-radius: 2px; color: #000 } .th-irpl-time-wrap { height: 21px; overflow-y: visible } .th-irpl-time { padding: 0 2px; margin-right: 4px; color: grey; text-align: end } .th-irpl-msg { padding: 0 1px 1px 5px; width: 100%; color: #000 } .th-irpl-actions { max-width: 92px; height: 21px } .th-upro-modal { z-index: 2100; overflow: auto } .th-upro-content { width: 340px; margin: -1px } .th-upro-header { color: #fff; margin-top: -1px } .th-upro-title { margin: 1px; max-width: 90% } .th-upro-body { padding: 0 } .th-upro-pro { width: 100%; border: 1px solid #d3d3d3; padding: 0 0 3px; margin: 0; border-radius: 1px } .th-upro-profile-container { max-width: 600px; margin: auto; border-radius: 0; overflow: hidden; font-family: Arial,sans-serif } .th-upro-cover { width: 100%; height: 150px; background-color: rgb(243 243 243 / 0%); position: relative; background-size: 100% 100%; border: 0 } .th-upro-picture { width: 100px; height: 100px; border-radius: 50%; border: 2px solid #fff; position: absolute; bottom: -50px; left: 20px; background-size: 100% 100%; overflow: visible; z-index: 1 } .th-upro-pic-btn { position: absolute; right: -2px; bottom: -2px; z-index: 3; width: 30px; height: 30px; line-height: 27px!important; text-align: center; padding: 0; border: 2px solid #fff; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; cursor: pointer; font-size: 13px; font-weight: 300!important; display: none; -webkit-tap-highlight-color: transparent } .th-upro-cover-btn { position: absolute; bottom: 10px; right: 10px; background: rgba(0,0,0,.5); color: #fff; border: none; padding: 5px 10px; border-radius: 5px; cursor: pointer; font-weight: 300!important; display: none } .th-upro-profile-content { padding: 11px 0 20px; text-align: left; display: flex; align-items: center; border: 0; border-color: #ff00; background: #ff00 } .th-upro-name-wrap { margin-left: 123px } .th-upro-profile-name { font-size: 1.5em; font-weight: 700; display: flex; align-items: center } .th-upro-verification { width: 22px!important; margin-left: 8px } .th-upro-game-xo { --icon-url: url('/ludo/img/x-o.webp') } .th-upro-game-ludo { --icon-url: url('/ludo/img/ludo1.png') } .th-upro-meta-label { width: 100%; text-align: end; margin-bottom: 0 } .th-upro-yt { font-size: 0!important; width: 1px } .th-upro-star { text-align: center; margin-top: 10px } .th-upro-co { margin: 4px } .th-upro-bio { color: #555; margin: 5px 0 4px; -webkit-text-size-adjust: 100%!important; text-size-adjust: 100%!important } .th-upro-action { margin: 2px; width: 106px; text-align: center } .th-upro-action-no-margin { width: 106px; text-align: center } .th-upro-black { color: #000 } .th-upro-red { color: red } .th-upro-blue { color: #00f } .th-upro-maroon { color: maroon } .th-upro-deeppink { color: #ff1493!important } .th-upro-darkorchid { color: #9932cc } .th-upro-green { color: green!important } .th-upro-crimson { color: #dc143c } .th-upro-mute-red { color: #cc3232 } .th-upro-frame-blue { color: #1e3a8a } .th-upro-frame-green { color: #065f46 } .th-upro-cover-purple { color: #4c1d95 } .th-upro-edit-box { padding: 4px; width: 100% } .th-upro-edit-label { height: 32px; padding: 8px } .th-upro-topic-textarea { height: 32px; padding: 4px; width: 60%; resize: none } .th-upro-like-label { color: red } .th-upro-eva-label { color: #00a6ff } .th-upro-mute-label { color: #cd5c5c } .thMuteDurModal { display: none; position: fixed; inset: 0; z-index: 10050 } .thMuteDurModalBackdrop { position: absolute; inset: 0; background: rgba(15,23,42,.45) } .thMuteDurModalBox { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: min(92vw,360px); background: #fff; border-radius: 16px; box-shadow: 0 20px 50px rgba(0,0,0,.22); overflow: hidden } .thMuteDurModalHeader { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid rgba(0,0,0,.08); background: linear-gradient(180deg,#fafbfc 0,#fff 100%) } .thMuteDurModalTitle { font-size: 15px; font-weight: 700; color: #1e293b } .thMuteDurModalClose { background: 0 0; border: none; font-size: 20px; line-height: 1; cursor: pointer; color: #64748b; padding: 0 } .thMuteDurModalGrid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; padding: 14px 16px 16px } .thMuteDurModalGrid .thMuteDurBtn { margin: 0; padding: 10px 8px; border-radius: 10px; font-size: 13px; font-weight: 600 } .th-upro-small-input { width: 160px } .th-upro-save-small { margin: 2px } .th-upro-power-box { width: 100%; padding: 4px; margin-top: 2px } .th-upro-power-search { width: 200px; display: block; margin-bottom: 2px } .th-upro-power-select { width: 200px; display: inline } .th-upro-room-box { width: 100%; padding: 4px } .th-upro-room-select { width: 200px; display: inline } #story { position: relative; display: flex; overflow: visible; width: 100%; flex-direction: row; flex-wrap: nowrap; align-items: center; border: 0; background: #fafafa; border-radius: 0 } #story .addstory { position: relative; text-align: center; margin: 10px 0 5px 5px; width: 65px; height: auto; min-width: 65px; max-width: 65px; min-height: 0; max-height: none; flex: 0 0 65px; cursor: pointer; display: flex; justify-content: center; align-items: center; margin-top: 4px!important } #story .img_str { width: 60px!important; height: 60px!important; min-width: 60px!important; min-height: 60px!important; max-width: 60px!important; max-height: 60px!important; border: 0; padding: 0; border-radius: 50%; object-fit: cover; display: block } .th-story-text-bg { background-size: cover!important; background-position: center!important } .th-story-caption { position: absolute; left: 0; right: 0; bottom: 0; z-index: 10020; color: #fff; padding: 14px 16px 18px; box-sizing: border-box; pointer-events: auto } .th-story-caption.is-media { background: rgba(0,0,0,.55); max-height: 34%; transition: max-height .25s,background .2s } .th-story-caption.is-media.is-expanded { max-height: 78%; background: rgba(0,0,0,.78) } .th-story-caption.is-text-only { top: 0; bottom: 0; display: flex!important; align-items: center; justify-content: center; background: 0 0; padding: 70px 22px 90px } .th-story-caption-text { white-space: pre-wrap; word-break: break-word; font-size: 16px!important; line-height: 1.45!important; text-align: center } .th-story-caption.is-media .th-story-caption-text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; text-align: center } .th-story-caption.is-media.is-expanded .th-story-caption-text { display: block; -webkit-line-clamp: unset; overflow: auto; max-height: calc(78vh - 80px); text-align: center } .th-story-caption-more { display: none; margin: 8px auto 0; border: 0; background: 0 0; color: #ddd; font-size: 13px!important; padding: 0; cursor: pointer; text-align: center; width: 100% } .th-story-composer { position: fixed; inset: 0; z-index: 100000000; background: rgba(0,0,0,.55); display: flex; align-items: center; justify-content: center; padding: 12px } .th-story-composer-card { width: 100%; max-width: 420px; background: #fff; border-radius: 12px; padding: 12px; box-sizing: border-box } .th-story-composer-head { display: flex; justify-content: space-between; align-items: center; font-weight: 700; margin-bottom: 8px } .th-story-composer-x { border: 0; background: 0 0; font-size: 18px; cursor: pointer } .th-story-composer-preview { width: 100%; height: 220px; border-radius: 10px; overflow: hidden; position: relative; display: flex; align-items: center; justify-content: center; margin-bottom: 8px } .th-story-composer-preview-text { color: #fff; padding: 16px; text-align: center; white-space: pre-wrap; word-break: break-word; font-size: 16px!important; z-index: 2; max-height: 100%; overflow: auto } .th-story-composer-preview-img,.th-story-composer-preview-vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #111; z-index: 1 } .th-story-composer-input { width: 100%; min-height: 72px; resize: vertical; border: 1px solid #ddd; border-radius: 8px; padding: 8px; box-sizing: border-box } .th-story-composer-meta { text-align: left; color: #777; font-size: 12px!important; margin: 4px 0 8px } .th-story-composer-colors { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px } .th-story-bg-dot { width: 28px; height: 28px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; padding: 0 } .th-story-bg-dot.is-on { border-color: #222; box-shadow: 0 0 0 2px #fff,0 0 0 3px #222 } .th-story-composer-actions { display: flex; flex-wrap: wrap; gap: 6px } .th-story-composer-actions .btn { flex: 1 1 auto } #story .fa-plus-circle { font-size: 16px!important; position: absolute; bottom: 0; right: 0; background: #fff; border-radius: 50%; color: #c9302c; line-height: 1; z-index: 2 } #story .itemstory { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; margin-top: 0; gap: 10px; flex: 1 1 auto; min-width: 0; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none } #story .itemstory::-webkit-scrollbar { display: none; height: 0; width: 0 } .TH_ROOM_TABS_V3__TH { width: 100%; display: flex; gap: 6px; padding: 6px 6px 0; box-sizing: border-box } .TH_ROOM_TH_TAB_V3 { flex: 1; border-radius: 10px; position: relative } .TH_TAB_BADGE_V3 { display: none; position: absolute; top: 6px; right: 10px; min-width: 18px; height: 18px; line-height: 18px; border-radius: 999px; padding: 0 6px; font-size: 12px; text-align: center; background: #ef4444; color: #fff } .TH_BADGE_CHAT { right: 0 } #d0 { width: 100%; margin-top: -1px } #d0 button { height: 31px; margin-top: 2px; -ms-touch-action: manipulation; touch-action: manipulation } #d0 .th-d0-users { width: 16%!important } #d0 .th-d0-chats { width: 19%!important } #d0 .th-d0-rooms { width: 21%; padding: 0 0 0 8px } #d0 .th-d0-rooms span { width: 21%!important } #d0 .th-d0-settings { width: 20%!important } #d0 .filter_notf { position: absolute; top: 50%; right: 3px; height: 40px; width: 40px!important; border-radius: 25px!important; border: 0!important; display: flex; flex-direction: column; align-items: center } .thNoAft { display: none } .thNoAftTopic { margin-left: 2px; border-radius: 2px; padding: 1px } .thNoAftStat { width: 4px; min-height: 100%; max-height: 63px } .thWithAft { width: 80px; margin: -4px 0 0 -2px!important; padding: 40px; height: 80px!important; position: relative!important; border: 0 } .thWithAftTopic { margin-left: 3px; border-radius: 2px; padding: 1px } .thWithAftIco { margin-left: 17px!important } .thWithAftMsg { font-family: 'El Messiri',FontAwesome!important; font-size: 14px!important; display: block; margin-left: 21px!important; margin-top: 4px!important } .thWithAftPic { border-radius: 122px!important; height: 60px!important; width: 62px!important; margin: 5px -10px 10px -71px!important; min-width: 60px!important; min-height: 60px!important; max-height: 60px!important; background-size: 100% 100%!important } .thWithAftStat { width: 13px!important; height: 13px!important; min-height: 0!important; margin-right: 0; z-index: 999999; border-radius: 0 5px; margin-left: 1px; margin-top: 1px; border: 1px solid #fff } .thMftSquarePic.thWithAftPic { border-radius: 3px!important; border: 1px solid #fff!important; margin-right: 2px!important; margin-left: 9px!important } .thMftSquarePic.u-pic-style2 { border-radius: 3px!important; border: 1px solid #fff!important; margin-left: 9px!important; margin-right: 2px!important } .thUserRow { width: 100%; font-size: large } .thMuted { color: #cd5c5c; display: none; width: 16px; margin-right: -16px } .thUserBody { padding: 0 3px; overflow: hidden } #chats .thUserBody { padding: 0 6px } .thUserTop { width: 100%; display: flex; margin-top: 1px; height: 21px } .thUTopic { padding-top: 2px; max-width: 100%; border-radius: 2px } .thUMsg { width: 100%; margin-top: 0; display: contents } .thUserHashBox { margin-left: -32px } .thUserHash { color: grey; font-size: 70%!important; margin-left: auto } #chats .thUserHash { margin-top: -16px } .thUserHashExtra { display: none } .NotReply { outline: 0; border: 0; background: #fffefe; font-size: 12px!important; font-weight: 700!important; padding: 4px 11px; margin: 0; border-radius: 999px; cursor: pointer; transition: .18s; color: var(--bt-primary) } .NotReply::before { font-size: 11px!important } #thMicMusicBar { position: fixed; z-index: 0!important; width: 332px; max-width: 96vw; padding: 8px!important; border-radius: 12px!important; border: 1px solid rgba(0,0,0,.12)!important; color: #111827!important; direction: rtl!important; font-family: Cairo,Arial,sans-serif!important; display: flex; flex-direction: column; align-items: stretch; background: var(--bt-primary) } #thMicMusicBar::before { display: none } #thMicMusicFile { display: none!important } .th-mic-music-title { height: auto!important; min-height: 26px!important; display: flex!important; align-items: center!important; gap: 6px!important; margin: 0!important; padding: 0!important; border-radius: 0!important; border: 0!important; color: #111827!important; font-size: 12px!important; font-weight: 700!important; white-space: nowrap!important; overflow: hidden!important; flex: 1!important } .th-mic-music-title .fa { width: auto!important; height: auto!important; min-width: 0!important; display: inline-block!important; border-radius: 0!important; background: 0 0!important; color: #111827!important; font-size: 14px!important } #thMicMusicName { display: block!important; overflow: hidden!important; text-overflow: ellipsis!important; color: #fff!important; max-width: 150px } .th-mic-music-actions { display: flex!important; align-items: center!important; gap: 5px!important; flex-wrap: wrap!important; justify-content: center!important; margin: 0!important } .th-mic-music-actions button { height: auto!important; min-height: 0!important; padding: 5px 8px!important; border: 0!important; border-radius: 8px!important; color: #fff!important; font-size: 12px!important; font-weight: 700!important; cursor: pointer!important; box-shadow: none!important } .th-mic-music-actions button:hover { transform: translateY(-1px); filter: brightness(1.06) } .th-mic-music-actions button:active { transform: scale(.97) } #thMicMusicChoose { background: #2563eb!important; color: #fff!important } #thMicMusicPlay { background: #16a34a!important } #thMicMusicPause { background: #f59e0b!important } #thMicMusicDelete { background: #6b7280!important } #thMicMusicVolume { width: 100%!important; height: 4px!important; margin: 6px 0 0!important; accent-color: #8b5cf6!important; cursor: pointer!important } #blockpro>i.music.btn.btn-warning.th-mic-btn { background: linear-gradient(135deg,#d37be3,#c533de)!important; color: #fff; display: none } .th-mic-menu br { display: none } .th-mic-music-head { display: flex!important; align-items: center!important; justify-content: space-between!important; gap: 8px!important } .th-mic-music-toggle { height: auto!important; min-width: 0!important; padding: 5px 9px!important; border: 0!important; border-radius: 8px!important; background: #f3f4f6!important; color: #111827!important; font-size: 12px!important; font-weight: 700!important; cursor: pointer!important; box-shadow: none!important } #thMicMusicBody { margin-top: 8px!important } #thMicMusicBar.th-music-collapsed { padding-bottom: 6px!important } #blockpro>.music,#thMicMusicBar.th-music-collapsed #thMicMusicBody { display: none } #blockpro>.music.th-show-music { display: block!important } .idboot { overflow: hidden!important; margin-top: 3px } .idboot .u-pic { min-width: 48px!important; width: 48px!important; height: 48px!important; max-height: 48px!important; padding: 3px!important; border-radius: 50%!important; border: 2px solid #fff!important } .idboot .u-topic { display: inline-flex!important; align-items: center!important; gap: 5px!important; color: #6d28d9!important; background: rgba(124,58,237,.08)!important; border: 1px solid rgba(124,58,237,.14)!important; border-radius: 999px!important; padding: 2px 9px!important; font-weight: 900!important; font-size: 12px!important; max-width: 160px!important } .idboot .tago { color: #8b5cf6!important; background: rgba(255,255,255,.65)!important; border: 1px solid rgba(124,58,237,.1)!important; border-radius: 999px!important; padding: 1px 7px!important; margin-top: 1px!important; font-size: 10px!important } .idboot .u-msg { width: 100%!important; border-radius: 13px!important } .idboot .u-msg b { color: #4c1d95!important; font-weight: 900!important } .idboot .u-msg span { font-weight: 900!important; text-shadow: 0 1px 0 rgba(255,255,255,.8) } #d2 .idboot #delmsg,#d2 .idboot .Del_com,#d2 .idboot .btn-like,#d2 .idboot .comm,#d2 .idboot .like2,#d2 .idboot .reply,#d2 .idboot .u-rply,#d2 .idboot>.fa-heart,#d2 .idboot>.fa-reply,#d2 .idboot>.fa-times { display: none!important } #thMicMusicMuteMic { background: #ef4444!important } #thMicMusicUnmuteMic { background: #0ea5e9!important } #top10>div.ltop>div:nth-child(8) { background-color: #ffb850!important } #top10>div.ltop>div:nth-child(9) { background-color: #cddc39!important } #top10>div.ltop>div:nth-child(10) { background-color: #00bcd4!important } #top10>div.ltop>div:nth-child(11) { background-color: #f5bdff!important } #top10>div.ltop>div:nth-child(12) { background-color: #41efa3!important } #top10>div.ltop>div:nth-child(13) { background-color: #58ff5f!important } #top10>div.ltop>div:nth-child(14) { background-color: #eb73ff!important } #top10>div.ltop>div:nth-child(15) { background-color: #ffb850!important } #top10>div.ltop>div:nth-child(16) { background-color: #cddc39!important } #top10>div.ltop>div:nth-child(17) { background-color: #00bcd4!important } .thGiftPopRoot.popover { position: fixed!important; top: 50%!important; left: 50%!important; right: auto!important; bottom: auto!important; margin: 0!important; transform: translate(-50%,-50%)!important; width: min(92vw,400px)!important; max-width: 400px!important; min-width: 320px!important; height: auto!important; max-height: min(70vh,520px)!important; overflow: hidden!important; white-space: normal!important; border: 1px solid rgba(15,23,42,.12)!important; border-radius: 14px!important; box-shadow: 0 18px 48px rgba(15,23,42,.18)!important; z-index: 9999999!important; background: #fff!important } .thGiftPopRoot .arrow { display: none!important } .thGiftPopRoot .popover-title { background: var(--bt-primary)!important; color: #fff!important; text-align: center!important; font-family: 'El Messiri',sans-serif!important; font-size: 14px!important; font-weight: 600!important; line-height: 1.2!important; padding: 7px 12px!important; border-radius: 14px 14px 0 0!important; border-bottom: 0!important } .thGiftPopContent.popover-content { padding: 0; max-height: calc(min(70vh,520px) - 36px)!important; overflow-y: auto!important; background: #f8fafc!important; padding-bottom: 47px!important } .thGiftPopover { display: block!important; width: 100%!important; padding: 12px!important; box-sizing: border-box!important } .thGiftPopoverActions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid rgba(15,23,42,.08) } .thGiftPopoverGrid { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; align-items: center } .thGiftClose,.thGiftRemove { background: #2563eb!important; border: none!important; border-radius: 8px!important; padding: 8px 14px!important; font-size: 13px!important; color: #fff!important; margin: 0!important } .thGiftRemove { background: #64748b!important } .thGiftItem { padding: 6px!important; margin: 0!important; max-width: 160px!important; max-height: 48px!important; width: auto!important; height: auto!important; object-fit: contain!important; border-radius: 8px!important; border: 1px solid rgba(15,23,42,.1)!important; background: #fff!important } .fa-trophy::before { content: "\f091"; font-family: FontAwesome } .th-custom-emo-menu { position: fixed; z-index: 999999999999 } .th-custom-emo-menu-inner { width: 300px; max-width: 300px; height: 280px; min-height: 280px; max-height: 280px; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; touch-action: pan-y; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #9aa7b5 #eef2f6; -ms-overflow-style: auto; padding: 0 5px; background: #fff; border: 1px solid; border-radius: 0; box-sizing: border-box; contain: content } .th-custom-emo-menu-inner::-webkit-scrollbar { width: 8px; display: block } .th-custom-emo-menu-inner::-webkit-scrollbar-track { background: #eef2f6 } .th-custom-emo-menu-inner::-webkit-scrollbar-thumb { background: #9aa7b5; border-radius: 4px } .th-custom-emo-menu-inner .th-custom-emo-item { margin: 2px; cursor: pointer; border-radius: 4px; width: auto!important; height: auto!important; max-width: 260px!important; max-height: 24px!important; object-fit: contain; vertical-align: middle } #dpnl.th-dpnl-repaint>.tab-pane.active { isolation: auto } #clearFilter { width: 100%; height: 38px; padding: 0 14px; border-radius: 12px; border: 1px solid rgba(17,24,39,.12); background: #d53535; color: #fff; font-size: 13px; font-weight: 900; letter-spacing: .2px; cursor: pointer; outline: 0; transition: transform .12s,box-shadow .12s,opacity .12s } input.th-room-pwd-mask { -webkit-text-security: disc; text-security: disc; caret-color: #111; color: #111 } .thPmReplyBtn { background: #ffffff00!important; color: var(--bt-primary)!important } .th-bc-msg-body br { display: none; } .thBcType-chat .u-msg .thBcReact { display: flex!important; flex-direction: row!important; align-items: center; gap: 0; margin: 0 0 1px auto!important; left: auto!important; float: none!important; clear: both!important; width: max-content!important; max-width: 100%!important; background: rgb(0 0 0 / 2%)!important; } .thBcType-chat .thBcReact .Del_com { float: none!important; margin: 0 2px 0 4px!important; padding: 0!important; max-width: none!important; width: auto!important; height: 25px!important; min-height: 0!important; position: relative; z-index: 3; display: inline-flex!important; align-items: center; background: 0 0!important; border: 0!important; box-shadow: none!important } .thBcType-chat .thBcReact .Del_com #delmsg,.thBcType-chat .thBcReact .Del_com button { width: 25px!important; height: 25px!important; min-width: 25px!important; padding: 0!important; margin: 0!important; line-height: 25px!important; border-radius: 50%!important; display: inline-flex!important; align-items: center; justify-content: center } .thBcType-chat .Del_com { max-width: 36px!important; width: auto!important; height: auto!important; min-height: 28px; align-items: center; gap: 0; position: relative; z-index: 3; margin-top: 4px } .thBcReactBtn { width: 28px; height: 28px; border: 0; border-radius: 50%; background: #eef2f7; color: #3578e5; display: inline-flex; align-items: center; justify-content: center; padding: 0; cursor: pointer; box-shadow: 0 1px 2px rgba(0,0,0,.12) } .thBcReactBtn.is-active { background: #fff; box-shadow: 0 0 0 1px rgba(53,120,229,.25),0 1px 3px rgba(0,0,0,.12) } .thBcReactBtnIco { font-size: 15px; line-height: 1 } .thBcReactSummary { display: inline-flex; align-items: center; gap: 3px; max-width: 140px; overflow: hidden } .thBcReactChip { display: inline-flex; align-items: center; gap: 2px; background: #fff; border: 1px solid rgba(0,0,0,.08); border-radius: 999px; padding: 1px 5px 1px 3px; font-size: 11px; color: #445; line-height: 1.2; box-shadow: 0 1px 2px rgba(0,0,0,.06) } .thBcReactChipIco { font-size: 12px } .thBcReactChipN { font-weight: 700; font-size: 10px } .thBcReactBar { display: none; position: absolute; left: 0; bottom: calc(100% + 6px); flex-direction: row-reverse; align-items: center; gap: 2px; padding: 6px 8px; background: #fff; border-radius: 999px; box-shadow: 0 4px 18px rgba(0,0,0,.18),0 1px 3px rgba(0,0,0,.08); z-index: 40; white-space: nowrap } .thBcReactBar.is-open { display: inline-flex; animation: .16s ease-out thBcReactPop } @keyframes thBcReactPop { from { transform: scale(.86); opacity: 0 } to { transform: scale(1); opacity: 1 } } .thBcReactItem { border: 0; background: 0 0; padding: 0; margin: 0; width: 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: transform .12s } .thBcReactItem:focus,.thBcReactItem:hover { transform: scale(1.22); outline: 0 } .thBcReactItem.is-picked { transform: scale(1.12) } .thBcReactFace { width: 32px; height: 32px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 20px; line-height: 1; box-shadow: inset 0 -1px 0 rgba(0,0,0,.06) } .hand.fitimg.thChatImgPreview { object-fit: contain; }