Modern redesign: Inter font, gradient header, pill filters, urgency c… (#18)

* Modern redesign: Inter font, gradient header, pill filters, urgency cards

- Inter (Google Fonts) replaces system sans-serif throughout
- Header: dark indigo gradient (1e1b4b → 4f46e5) with glow shadow
- Top strip: matching indigo-to-violet gradient
- Page background: slate-100 (#f1f5f9) so white cards pop
- Filter checkboxes: pill-style toggles using :has(input:checked),
  active state fills indigo — no JS changes needed
- Conference cards: 4px left border color-coded by urgency
  (red < 7d, amber < 30d, green otherwise), updated each tick
- CORE rank: purple badge; abstract deadline: rose badge
- Past Deadlines toggle: cleaner row with indigo hover accent
- Sort and search controls: unified indigo accent colour
- Footer: centered, muted

* Increase filter pill padding and gap

* Fix pill padding overridden by Bootstrap form-inline

Author: ajithsureshtii

index.html

@@ -13,6 +13,9 @@
     <link rel="shortcut icon" href="{{ "/static/img/favicon.png" | prepend:site.baseurl }}">
     <link rel="stylesheet" type="text/css" href="{{ "/static/css/styles.css" | prepend:site.baseurl }}" media="screen,projection">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
     <!-- Global site tag (gtag.js) - Google Analytics
     <script async src="https://www.googletagmanager.com/gtag/js?id=G-ZY66C08954"></script>-->