/* ============================================================
 * rinka-links.css — りんか公式リンク集（/links/）の見た目（2026-09-26・追加のみ）
 * ・読み込みは inc/fansite.php（リンク集ページだけ・rinka-world-2026.css のあと）。
 * ・りんかの絵（assets/img/ui/rinka-avatar.webp＝ノベル立ち絵からの切り抜き）を大きく。
 * ・リンクのしるしは共通アイコン（assets/img/ui/*.webp）。カードを大きく・押しやすく。
 * ========================================================== */

.rinka-fs-linktree { max-width: 560px; }

/* ---------- プロフィール ---------- */
.rinka-fs-linktree__profile {
	position: relative;
	margin: 0 0 22px;
	padding: 26px 18px 20px;
	border-radius: 28px;
	background:
		radial-gradient(120% 90% at 50% 0%, rgba(255, 143, 191, .22), transparent 62%),
		radial-gradient(90% 70% at 100% 100%, rgba(185, 163, 255, .18), transparent 60%),
		#fff;
	box-shadow: 0 1px 0 #fff inset, 0 18px 40px -22px rgba(184, 58, 114, .38), 0 0 0 1px #f4d9e6;
	overflow: hidden;
}
.rinka-fs-linktree__avatar {
	position: relative;
	display: block;
	width: 148px;
	height: 148px;
	margin: 0 auto;
	padding: 5px;
	border-radius: 50%;
	background: linear-gradient(135deg, #ff8fbf, #c9a2ff 55%, #8fd6ff);
	box-shadow: 0 14px 30px -12px rgba(184, 58, 114, .5);
}
.rinka-fs-linktree__avatar::after {
	/* 小さなきらめき（飾り） */
	content: '';
	position: absolute;
	right: -4px; top: 6px;
	width: 34px; height: 34px;
	background: url("../img/ui/sparkle.webp") center / contain no-repeat;
	filter: drop-shadow(0 2px 3px rgba(150, 60, 110, .25));
}
.rinka-fs-linktree .rinka-fs-linktree__profile img {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	border: 4px solid #fff;
	object-fit: cover;
	background: #ffecf4;
	box-shadow: none;
}
.rinka-fs-linktree__name {
	margin: 14px 0 4px;
	font-size: 1.22rem;
	color: #4a3540;
	letter-spacing: .02em;
}
.rinka-fs-linktree__bio { color: #6a5260; font-size: .9rem; }

/* ---------- リンクカード ---------- */
.rinka-fs-linktree__list { gap: 14px; }
.rinka-fs-linktree .rinka-fs-linktree__item {
	display: flex;
	align-items: center;
	gap: 14px;
	min-height: 76px;
	padding: 12px 14px 12px 12px;
	border-radius: 22px;
	border: 0;
	background: #fff;
	box-shadow: 0 0 0 1px #f1dbe6, 0 10px 24px -16px rgba(184, 58, 114, .4);
	color: inherit;
	text-decoration: none;
	transition: transform .25s cubic-bezier(.34, 1.56, .64, 1), box-shadow .25s ease;
}
@media (hover: hover) {
	.rinka-fs-linktree .rinka-fs-linktree__item:hover { transform: translateY(-2px); box-shadow: 0 0 0 1.5px #f3b6d0, 0 16px 30px -16px rgba(184, 58, 114, .5); }
}
.rinka-fs-linktree .rinka-fs-linktree__item:active { transform: scale(.985); }
.rinka-fs-linktree .rinka-fs-linktree__item:focus-visible { outline: 3px solid #b03a6e; outline-offset: 3px; }
.rinka-fs-linktree__icon {
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	border-radius: 18px;
	background: radial-gradient(circle at 50% 38%, #fff 0%, #fdeef5 72%);
	box-shadow: inset 0 0 0 1px rgba(184, 58, 114, .10);
	font-size: 1.5rem;
}
.rinka-fs-linktree__icon img { width: 40px; height: 40px; object-fit: contain; display: block; }
.rinka-fs-linktree__label { font-size: 1.02rem; color: #4a3540; }
.rinka-fs-linktree__desc { color: #6a5260; font-size: .84rem; line-height: 1.55; margin-top: 3px; }
.rinka-fs-linktree__arrow {
	position: relative;
	flex: none;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #fdeef5;
}
.rinka-fs-linktree__arrow::before {
	content: '';
	position: absolute;
	left: 50%; top: 50%;
	width: 9px; height: 9px;
	margin: -5px 0 0 -7px;
	border-top: 2.5px solid #b03a6e;
	border-right: 2.5px solid #b03a6e;
	transform: rotate(45deg);
}

/* いちばん大事なリンク（Patreon）＝ピンクのグラデ */
.rinka-fs-linktree .rinka-fs-linktree__item--primary {
	min-height: 88px;
	background: linear-gradient(120deg, #ff8fbf 0%, #e0588f 55%, #b77bff 100%);
	box-shadow: 0 16px 32px -14px rgba(224, 88, 143, .65), inset 0 1px 0 rgba(255, 255, 255, .35);
}
.rinka-fs-linktree__item--primary .rinka-fs-linktree__label { color: #fff; font-size: 1.1rem; }
.rinka-fs-linktree__item--primary .rinka-fs-linktree__desc { color: #fff; opacity: .95; }
.rinka-fs-linktree__item--primary .rinka-fs-linktree__icon { background: rgba(255, 255, 255, .92); box-shadow: 0 4px 10px rgba(150, 40, 90, .25); }
.rinka-fs-linktree__item--primary .rinka-fs-linktree__arrow { background: rgba(255, 255, 255, .25); }
.rinka-fs-linktree__item--primary .rinka-fs-linktree__arrow::before { border-color: #fff; }

@media (max-width: 400px) {
	.rinka-fs-linktree__avatar { width: 132px; height: 132px; }
	.rinka-fs-linktree .rinka-fs-linktree__item { gap: 12px; padding: 10px 12px 10px 10px; }
	.rinka-fs-linktree__icon { width: 48px; height: 48px; border-radius: 16px; }
	.rinka-fs-linktree__icon img { width: 36px; height: 36px; }
}

@media (prefers-color-scheme: dark) {
	.rinka-fs-linktree__profile { background: rgba(255, 255, 255, .05); box-shadow: 0 0 0 1px rgba(255, 255, 255, .1); }
	.rinka-fs-linktree__name { color: #f3e6ee; }
	.rinka-fs-linktree__bio, .rinka-fs-linktree__desc { color: #d2bfcb; }
	.rinka-fs-linktree .rinka-fs-linktree__item { background: #2b2330; box-shadow: 0 0 0 1px rgba(255, 255, 255, .1); }
	.rinka-fs-linktree__label { color: #f3e6ee; }
	.rinka-fs-linktree__arrow { background: rgba(255, 255, 255, .08); }
	.rinka-fs-linktree__arrow::before { border-color: #ff9fc8; }
}
@media (prefers-reduced-motion: reduce) {
	.rinka-fs-linktree .rinka-fs-linktree__item { transition: none; }
	.rinka-fs-linktree .rinka-fs-linktree__item:hover { transform: none; }
}