:root{
  --bg:#0f1115; --card:#171a21; --text:#e8eaed; --muted:#aab2bd;
  --line:#222633; --head:#11151f; --link:#7bb3ff;
}
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial;
  color:var(--text);
  background:var(--bg);
}

/* Header */
.site-header{
  padding:24px;
  text-align:center;
  background:linear-gradient(180deg,#131722,#0f1115);
}
h1{ margin:0 0 6px; font-size:28px; letter-spacing:.2px; }
.subtitle{ color:var(--muted); margin:0 0 8px; }

/* Layout */
.container{
  max-width:1100px; margin:24px auto; padding:0 16px;
  display:grid; gap:24px; grid-template-columns:1fr 380px;
}
@media (max-width: 980px){
  .container{ grid-template-columns:1fr; }
}

/* Cards */
.card{
  background:var(--card); border:1px solid var(--line);
  border-radius:12px; padding:16px;
  box-shadow: 0 0 0 1px rgba(0,0,0,.15) inset;
}

/* Board */
.board-header{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
#last-updated{ color:var(--muted); font-size:14px; }
.table-wrap{ overflow:auto; border-radius:8px; border:1px solid var(--line); }
table{ width:100%; border-collapse:collapse; }
thead th{
  text-align:left; padding:12px; background:var(--head);
  position:sticky; top:0; z-index:1;
}
th.sortable{ cursor:pointer; }
tbody td{ padding:12px; border-top:1px solid var(--line); }
tbody tr:hover{ background:#121722; }
.tip{ color:var(--muted); font-size:12px; margin-top:8px; }

/* News Section */
.news h2{ margin-top:0; }
.news a{ color:var(--link); text-decoration:none; }
.news a:hover{ text-decoration:underline; }

/* logo */
.brand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.logo {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid black;        
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4);
}