.rate-page{--rate-blue:#3b82f6;--rate-blue2:#60a5fa;--rate-blue-dark:#1e3a8a;--rate-bg:#020617;--rate-line:#3b82f68c;--rate-text:#f8fafc;--rate-muted:#94a3b8;--ap-cyan:#43f5ff;color:var(--rate-text);font-size:14px}
.rate-page .random-card{position:relative;overflow:hidden;border-radius:25px;padding:22px 14px 18px;background:radial-gradient(circle at 88% 12%,#3b82f661,transparent 30%),radial-gradient(circle at 76% 24%,#38bdf838,transparent 34%),linear-gradient(180deg,#07111f 0%,#020617 52%,#000 100%)}
.rate-page .random-card:before{content:"🎲";position:absolute;right:0;top:8px;width:200px;height:150px;display:flex;align-items:center;justify-content:center;font-size:118px;filter:drop-shadow(0 0 18px #23cdffbf);opacity:.18;pointer-events:none}
.rate-page h1{position:relative;z-index:2;margin:0 0 10px;color:#fff;font-size:clamp(34px,5vw,54px);line-height:1.2;font-weight:900;letter-spacing:-.4px;text-shadow:0 2px 4px #000,0 0 14px #3b82f64d}
.rate-page h1::first-letter{color:var(--cyan)}
.rate-page .sub{position:relative;z-index:2;max-width:720px;margin:0 0 18px;color:#cbd5e1;font-size:14px;line-height:1.45;font-weight:500;text-shadow:0 2px 4px #000}
.rate-page #filterBtns{position:relative;z-index:2;display:grid!important;grid-template-columns:repeat(2,1fr);gap:0!important;overflow:hidden;margin:10px 0!important;padding:0!important;border:1px solid #3b82f661;border-radius:10px!important;background:#0f172ac7}
.rate-page #filterBtns .btn{height:46px;display:flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:0;border-right:1px solid #94a3b824;border-bottom:1px solid #94a3b824;background:linear-gradient(180deg,#1e293bd9,#0f172ab3);color:#94a3b8!important;font-size:13px;line-height:1;font-weight:800}
.rate-page #filterBtns .btn:nth-child(2n){border-right:0}
.rate-page #filterBtns .btn:nth-last-child(-n+2){border-bottom:0}
.rate-page #filterBtns .btn i{font-size:17px}
.rate-page #filterBtns .btn.active{color:#fff!important;background:linear-gradient(180deg,#3b82f6,#1d4ed8);box-shadow:0 0 16px #3b82f6a6 inset,0 0 12px #3b82f68c}
.rate-page .rtp-toolbar{position:relative;z-index:2;display:flex;flex-direction:column;gap:10px;margin:10px 0!important;padding:0!important}
.rate-page .rtp-toolbar-left,.rate-page .rtp-toolbar-right{width:100%}
.rate-page .rtp-search{height:46px;display:flex;align-items:center;gap:9px;padding:0 12px!important;border:1px solid var(--rate-line);border-radius:10px!important;background:#020617db;box-shadow:0 0 12px #3b82f624 inset}
.rate-page .rtp-search .rtp-mono{display:flex;align-items:center}
.rate-page .rtp-search i{color:#dbeafe;font-size:21px}
.rate-page .rtp-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#fff;font-size:14px;font-weight:700}
.rate-page .rtp-search input::placeholder{color:#94a3b8}
.rtp-hidden-row{display:none}
.rate-page .rtp-pill{height:46px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--rate-line);border-radius:10px;background:#020617db;color:#cbd5e1;font-size:13px;line-height:1;font-weight:800;box-shadow:0 0 12px #3b82f624 inset}
.rate-page .rtp-pill:before{content:"\F116";font-family:"bootstrap-icons";color:#bfdbfe;font-size:20px;display:inline-block;animation:rate-spin 3s linear infinite;transform-origin:center}
@keyframes rate-spin {
from{transform:rotate(0deg)}
to{transform:rotate(360deg)}
}
.rate-page table{position:relative;z-index:2;width:100%;overflow:hidden;border-collapse:separate;border-spacing:0;margin:14px 0 0!important;padding:0!important;border:1px solid #3b82f6cc;border-radius:12px!important;background:#020617e0;box-shadow:0 0 18px #3b82f659}
.rate-page thead th{height:42px;padding:0 10px;background:linear-gradient(180deg,#1e40af,#07111f);color:#bfdbfe;font-size:11px;line-height:1;font-weight:900;text-transform:uppercase;border-bottom:1px solid #60a5fa5c}
.rate-page tbody td{height:50px;padding:0 10px;color:#f8fafc;font-size:14px;line-height:1.2;font-weight:800;vertical-align:middle;border-bottom:1px solid #3b82f626;background:#0f172a59}
.rate-page tbody tr:last-child td{border-bottom:0}
.rate-page .rtp-num{color:var(--rate-blue2);font-size:18px;font-weight:900;font-style:italic;white-space:nowrap}
.rate-page .rtp-name{color:#fff;font-size:14px;font-weight:900;text-shadow:0 2px 4px #000}
.rate-page tbody td:last-child{color:#f8fafc;font-size:14px;font-weight:900;text-align:right;white-space:nowrap}
.rate-page .rtp-bar{width:100%;height:13px;overflow:hidden;border-radius:999px;background:#ffffff12;box-shadow:0 3px 8px #000000a6 inset}
.rate-page .rtp-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#94a3b8,#e2e8f0);box-shadow:0 0 7px #ffffff2e}
.rate-page .wr-mid .rtp-bar i,.rate-page .wr-max .rtp-bar i{background:linear-gradient(90deg,#22c55e,#4ade80);box-shadow:0 0 10px #22c55e73}
@media(min-width:768px) {
.rate-page{font-size:15px}
.rate-page .random-card{border-radius:24px;padding:22px 22px 24px}
.rate-page h1{font-size:36px}
.rate-page .sub{max-width:760px;font-size:16px}
.rate-page #filterBtns{grid-template-columns:repeat(4,1fr)}
.rate-page #filterBtns .btn{height:54px;font-size:15px;border-bottom:0}
.rate-page #filterBtns .btn:nth-child(2n){border-right:1px solid #94a3b824}
.rate-page #filterBtns .btn:last-child{border-right:0}
.rate-page .rtp-toolbar{flex-direction:row;align-items:center;justify-content:space-between;gap:16px}
.rate-page .rtp-toolbar-left{flex:1;max-width:680px}
.rate-page .rtp-toolbar-right{width:auto}
.rate-page .rtp-search{height:52px}
.rate-page .rtp-pill{min-width:250px;height:52px;font-size:15px}
.rate-page thead th{height:48px;padding:0 18px;font-size:13px}
.rate-page tbody td{height:56px;padding:0 18px;font-size:15px}
.rate-page .rtp-num{font-size:22px}
.rate-page .rtp-name{font-size:15px}
.rate-page tbody td:last-child{font-size:16px}
.rate-page .rtp-bar{height:15px}
}
@media(min-width:1200px) {
.rate-page h1{font-size:52px}
.rate-page .sub{font-size:19px}
.rate-page #filterBtns .btn{height:58px;font-size:18px}
.rate-page #filterBtns .btn i{font-size:23px}
.rate-page .rtp-search{height:56px}
.rate-page .rtp-search input{font-size:16px}
.rate-page .rtp-pill{height:56px;min-width:285px;font-size:17px}
.rate-page table{border-radius:16px!important}
.rate-page thead th{height:52px;padding:0 24px;font-size:14px}
.rate-page tbody td{height:60px;padding:0 24px;font-size:17px}
.rate-page .rtp-num{font-size:27px}
.rate-page .rtp-name{font-size:18px}
.rate-page tbody td:last-child{font-size:20px}
.rate-page .rtp-bar{height:17px}
}