body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;margin:0;padding:0;}
header{display:flex;gap:16px;align-items:center;padding:10px 16px;background:#c40000;color:#fff;}
header h1{margin:0;font-size:20px;display:flex;gap:8px;align-items:center}
header h1 a{color:#fff;text-decoration:none;border:1px solid #fff;border-radius:4px;padding:2px 6px;display:inline-block}
.menu-toggle{display:none;background:transparent;border:1px solid #fff;color:#fff;border-radius:4px;padding:6px 10px;cursor:pointer;font-size:22px}
header nav a{margin-right:10px;text-decoration:none;color:#fff;opacity:0.95}
header nav a:hover{opacity:1}
header form{margin-left:auto}
.search-mobile{display:none}
.search-desktop{display:block}
header form input{padding:6px;border-radius:4px;border:1px solid rgba(255,255,255,0.4)}
header form button{padding:6px 10px;border:0;border-radius:4px;background:#fff;color:#c40000;cursor:pointer}
main{max-width:1100px;margin:16px auto;padding:0 16px}
ul{list-style:none;padding:0}
li{padding:8px 0;border-bottom:1px solid #f0f0f0}
small{color:#666;margin-left:8px}
footer{margin-top:24px;padding:16px;background:#c40000;color:#fff;}
footer a{color:#fff;text-decoration:none}
footer a:hover{text-decoration:underline}

/* Layout with sidebar */
.container{display:flex;gap:24px;align-items:flex-start}
.content{flex:1 1 auto}
.sidebar{width:340px}
.card{border:1px solid #f4dada;border-radius:6px;padding:10px;margin-bottom:16px;background:#fff7f7}
.card.tone2{background:#fff3f3;border-color:#f3caca}
.card.tone3{background:#ffeeee;border-color:#f2baba}
.card h3{margin:0 0 8px 0;font-size:16px}
.sidebar ul li{border-bottom:0;padding:6px 0}
.sidebar a{color:#111;text-decoration:none}
.sidebar a:hover{text-decoration:underline}
.tag{display:inline-block;background:#eee;color:#333;padding:2px 6px;border-radius:3px;margin:2px;font-size:12px}
.active-item{background:#fff8f8;border-left:3px solid #c40000;padding-left:8px}
.meta{font-size:12px;color:#666}
.clock{margin-right:6px}

/* Urgency dot */
.urgent-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:#ffdb00;margin-right:6px;animation:pulse 1s infinite alternate;vertical-align:middle}
@keyframes pulse{from{opacity:0.4}to{opacity:1}}

/* Ranked lists (Trending / Most Read) */
ol.rank-list{margin:0;padding-left:20px}
ol.rank-list li{border-bottom:0;padding:4px 0}
ol.rank-list li a{color:#111;text-decoration:none}
.rank-1 a{font-size:18px;font-weight:700}
.rank-2 a{font-size:17px;font-weight:600}
.rank-3 a{font-size:16px;font-weight:600}
.rank-4 a{font-size:15px;font-weight:500}
.rank-5 a{font-size:14px;font-weight:500}

/* Mobile tweaks */
@media (max-width: 768px){
  header{flex-wrap:wrap}
  header h1{flex:1}
  .menu-toggle{display:inline-block}
  header nav{display:none;width:100%;margin-top:8px}
  header nav.open{display:block}
  header nav a{display:block;margin:6px 0}
  .search-desktop{display:none}
  .search-mobile{display:block;margin-top:8px}
  .container{flex-direction:column}
  .sidebar{width:auto}
}