.diary-link {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-left: auto;
  color: #52637a;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
}

.diary-link > span { color: #1769ff; font-size: 16px; }
.diary-link b {
  display: grid;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  place-items: center;
  color: #fff;
  font-size: 9px;
  background: #1769ff;
  border-radius: 99px;
}
.diary-link + .admin-link { margin-left: 0; }

.course-card { position: relative; }
.bookmark-toggle {
  position: absolute;
  z-index: 4;
  top: 12px;
  right: 12px;
  display: grid;
  width: 43px;
  height: 43px;
  padding: 6px;
  place-items: center;
  color: #8a9aab;
  cursor: pointer;
  background: rgba(255,255,255,.94);
  border: 1px solid #dbe3ed;
  border-radius: 50%;
  box-shadow: 0 8px 22px rgba(12,32,58,.2);
  transition: transform .18s,color .18s,background .18s;
}
.bookmark-toggle:hover { transform: scale(1.08); }
.bookmark-toggle svg { width: 100%; height: 100%; overflow: visible; }
.bookmark-toggle circle { fill: #f1f4f8; stroke: currentColor; stroke-width: 1.3; }
.bookmark-toggle .rose-main { fill: #d7dee7; stroke: currentColor; stroke-width: .8; }
.bookmark-toggle .rose-minor { fill: #aab6c4; stroke: currentColor; stroke-width: .65; }
.bookmark-toggle.saved { color: #073f78; background: #edf6ff; border-color: #73a9e2; }
.bookmark-toggle.saved circle { fill: #e9f4ff; }
.bookmark-toggle.saved .rose-main { fill: #0c5faf; }
.bookmark-toggle.saved .rose-minor { fill: #32a1ff; }
.bookmark-toggle.saved svg { animation: rose-on .35s ease-out; }
@keyframes rose-on { from { transform: rotate(-25deg) scale(.7); } to { transform: rotate(0) scale(1); } }

@media (max-width:650px) {
  .diary-link { margin-left:auto; font-size:0; }
  .diary-link > span { font-size:18px; }
}