:root{--bg:#0b0c10;--bg2:#0f1322;--fg:#e9eef8;--muted:#a9b2c7;--brand:#ffd54a;--brand2:#00e1ff;--card:#111523;--border:#1d2335;--good:#17c964;--radius:18px;--shadow:0 12px 40px rgba(0,0,0,.35)}
*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,Helvetica,sans-serif;background:linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%);color:var(--fg)}
a{color:#cfe7ff;text-decoration:none}a:hover{text-decoration:underline}
.container{max-width:1120px;margin:0 auto;padding:26px}
.header{position:sticky;top:0;z-index:30;background:rgba(10,13,20,.8);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}
.header .inner{display:flex;align-items:center;gap:16px;padding:14px 0}.header img{height:44px}.header nav{margin-left:auto;display:flex;gap:18px}.header nav a{color:#fff;opacity:.92}.header nav a:hover{opacity:1}

.hero{
  position:relative;
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:22px;align-items:stretch;
  margin-top:18px;
  border-radius:20px;
  padding:14px;
  border:1px solid var(--border);
  overflow:hidden;
  background:
    radial-gradient(1200px 600px at 75% 20%, rgba(255,213,74,0.22) 0%, rgba(255,213,74,0) 60%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900' preserveAspectRatio='xMidYMid slice'><defs><linearGradient id='shadow' x1='0' y1='0' x2='1' y2='1'><stop offset='0' stop-color='%230b0f1a' stop-opacity='0'/><stop offset='1' stop-color='%230b0f1a' stop-opacity='0.35'/></linearGradient><radialGradient id='glow' cx='75%25' cy='20%25' r='60%25'><stop offset='0' stop-color='%23ffd54a' stop-opacity='0.20'/><stop offset='1' stop-color='%23ffd54a' stop-opacity='0'/></radialGradient></defs><rect width='1600' height='900' fill='url(%23shadow)'/><circle cx='1200' cy='150' r='340' fill='url(%23glow)'/><g transform='translate(1060,60)' opacity='0.13' fill='%2300e1ff'><circle cx='200' cy='200' r='170'/><circle cx='200' cy='200' r='138' fill='none' stroke='%2300e1ff' stroke-width='18'/><g transform='translate(200,200)'><g id='seg'><rect x='-8' y='-130' width='16' height='44' rx='6'/></g><use href='%23seg' transform='rotate(30)'/><use href='%23seg' transform='rotate(60)'/><use href='%23seg' transform='rotate(90)'/><use href='%23seg' transform='rotate(120)'/><use href='%23seg' transform='rotate(150)'/><use href='%23seg' transform='rotate(180)'/><use href='%23seg' transform='rotate(210)'/><use href='%23seg' transform='rotate(240)'/><use href='%23seg' transform='rotate(270)'/><use href='%23seg' transform='rotate(300)'/><use href='%23seg' transform='rotate(330)'/></g></g><g opacity='0.35' fill='%23ffd54a'><circle cx='240' cy='720' r='12'/><circle cx='290' cy='760' r='8'/><circle cx='340' cy='710' r='10'/></g><g opacity='0.22' fill='%23ff5a6a'><rect x='260' y='160' width='26' height='26' transform='rotate(45 273 173)' rx='3'/><path d='M520,280 c-14,-18 -42,-18 -56,0 c-10,12 -8,34 18,54 c26,-20 28,-42 18,-54z'/></g></svg>");
  background-size:cover;background-position:center;background-repeat:no-repeat;
  min-height:420px;
}
@media (max-width:980px){.hero{grid-template-columns:1fr}}

.card{background:linear-gradient(180deg, rgba(18,22,37,.88), rgba(17,20,33,.88));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.card.pad{padding:20px}
.badge{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(90deg,var(--brand),var(--brand2));padding:8px 12px;border-radius:999px;color:#0b0c10;font-weight:800;font-size:12px;letter-spacing:.3px}
.h1{font-size:44px;line-height:1.05;margin:10px 0}
.sub{color:var(--muted)}
.button{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(90deg,var(--brand),var(--brand2));color:#08121c;padding:12px 16px;border-radius:12px;font-weight:900}
.button:hover{transform:translateY(-1px)}.button.secondary{background:transparent;color:#fff;border:1px solid var(--border)}
.topbar{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0}@media (max-width:980px){.topbar{grid-template-columns:1fr}}
.topcard{padding:16px;border-radius:14px;border:1px solid var(--border);background:linear-gradient(180deg,#121a2c,#0f1423);display:flex;align-items:center;gap:12px}
.topcard .pill{padding:4px 8px;border-radius:999px;background:#1a2338;border:1px solid var(--border);font-size:12px;color:#cdd6f6}
.cgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:10px}@media (max-width:980px){.cgrid{grid-template-columns:1fr}}
.ccard{padding:18px;border-radius:16px;border:1px solid var(--border);background:linear-gradient(180deg,#131a2b,#0e1424);display:flex;flex-direction:column;gap:10px;transition:transform .15s ease, box-shadow .15s ease}
.ccard:hover{transform:translateY(-3px);box-shadow:0 14px 40px rgba(0,0,0,.35)}
.ccard .row{display:flex;justify-content:space-between;align-items:center}
.ccard .title{font-weight:900;font-size:18px;display:flex;align-items:center;gap:10px}
.ccard .score{font-weight:900}
.tag{display:inline-flex;align-items:center;gap:6px;background:#18213a;border:1px solid var(--border);border-radius:999px;padding:6px 10px;color:#cbd5f1;font-size:12px;margin:2px 6px 2px 0}
.tags{display:flex;flex-wrap:wrap;margin-top:6px}
.table{width:100%;border-collapse:separate;border-spacing:0}.table th,.table td{padding:14px 12px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}.table th{font-size:12px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.35px}.table tr:hover{background:#0d1324}
.rank{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#171f36;border:1px solid var(--border);font-weight:800}
.note{color:var(--muted);font-size:13px}
.footer{margin:34px 0 10px;color:var(--muted);font-size:13px}.footer .links{display:flex;gap:12px;flex-wrap:wrap;margin:8px 0}.footer .links a{color:#cdd6f6}
.trust{position:sticky;bottom:0;z-index:20;background:rgba(10,13,20,.85);backdrop-filter:blur(8px);border-top:1px solid var(--border);padding:10px 16px;display:flex;justify-content:space-between;align-items:center}
.badge-18{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--border);border-radius:999px;color:#fff}
.icon{width:28px;height:28px;vertical-align:middle}