/* ============================================================
 * rinka-gifts.css — りんかにプレゼント（/gifts/）2026-09-26 作り直し
 * ・rkg- で始まる新しいクラス＋旧クラス（rinka-fs-gifts__*）の見た目の上書き。
 * ・贈りもの選び → ラッピング（包み紙・リボン）→ 箱があく → おかえし。
 * ・スマホ縦 → 横 → PC。prefers-reduced-motion では動きを止める。
 * ========================================================== */

.rinka-fansite .rkg {
	--rkg-ink: #4a3540;
	--rkg-ink-soft: #7a6470;
	--rkg-rose: #d9468a;
	--rkg-rose-ink: #b3336f;
	--rkg-card: #fff;
	--rkg-line: #f4d8e6;
	--rkg-soft: #fff5fa;
	--rkg-shadow: 0 16px 34px -16px rgba(150, 60, 110, .38), 0 2px 6px rgba(150, 60, 110, .07);
	max-width: 960px;
	margin: 6px auto 28px;
	color: var(--rkg-ink);
}
.rinka-fansite .rkg::before { display: none; }
.rinka-fansite .rkg img { max-width: 100%; }
.rinka-fansite .rkg .rkg-ico { width: 28px; height: 28px; vertical-align: middle; }
.rinka-fansite .rkg .rkg-ico--sm { width: 22px; height: 22px; flex: none; vertical-align: -5px; margin-right: 4px; }
.rinka-fansite .rkg .rkg-heart { width: 13px; height: 12px; fill: currentColor; flex: none; }

/* 包み紙・リボンの色（箱とえらぶボタンで共通） */
.rkg-paper--sakura { --paper: radial-gradient(circle at 25% 25%, #fff 0 2.5px, transparent 3.5px) 0 0 / 18px 18px, radial-gradient(circle at 75% 75%, #ffe0ee 0 2.5px, transparent 3.5px) 0 0 / 18px 18px, linear-gradient(160deg, #ffb0d0, #ff8fbf); }
.rkg-paper--lavender { --paper: repeating-linear-gradient(45deg, rgba(255, 255, 255, .28) 0 7px, transparent 7px 14px), linear-gradient(160deg, #cdb8ff, #a98cf2); }
.rkg-paper--mint { --paper: linear-gradient(90deg, rgba(255, 255, 255, .3) 50%, transparent 50%) 0 0 / 14px 14px, linear-gradient(rgba(255, 255, 255, .3) 50%, transparent 50%) 0 0 / 14px 14px, linear-gradient(160deg, #a6ead6, #74cfb2); }
.rkg-paper--cream { --paper: radial-gradient(circle, #ffb3cf 0 2.2px, transparent 2.8px) 0 0 / 16px 16px, linear-gradient(160deg, #fff6e2, #ffe9c4); }
.rkg-paper--night { --paper: radial-gradient(circle, #fff3a8 0 1.4px, transparent 2px) 0 0 / 14px 14px, radial-gradient(circle, #fff 0 1px, transparent 1.5px) 7px 7px / 14px 14px, linear-gradient(160deg, #7a73d6, #3f3b8e); }
.rkg-ribbon--pink { --rb: #ff5f9e; --rb2: #ff9cc5; }
.rkg-ribbon--red { --rb: #e0415f; --rb2: #ff7d92; }
.rkg-ribbon--gold { --rb: #eaa91f; --rb2: #ffd970; }
.rkg-ribbon--sky { --rb: #4ea5ef; --rb2: #9fd0ff; }
.rkg-ribbon--white { --rb: #fdfdfd; --rb2: #fff; }

/* ---------- 見出し・ブロック ---------- */
.rinka-fansite .rkg .rkg-h2 {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 14px;
	padding: 0;
	border: 0;
	background: none;
	font-size: 1.12rem;
	font-weight: 900;
	color: var(--rkg-ink);
}
.rinka-fansite .rkg .rkg-h2::before, .rinka-fansite .rkg .rkg-h2::after { display: none; }
.rinka-fansite .rkg .rkg-h2__icon { width: 36px; height: 36px; flex: none; filter: drop-shadow(0 3px 4px rgba(150, 60, 110, .18)); }
.rinka-fansite .rkg .rkg-block {
	margin: 18px 0 0;
	padding: 20px 16px;
	background: var(--rkg-card);
	border: 1px solid var(--rkg-line);
	border-radius: 26px;
	box-shadow: var(--rkg-shadow);
}

/* ---------- ① りんかとふきだし ---------- */
.rinka-fansite .rkg .rkg-stage {
	display: grid;
	grid-template-columns: 84px 1fr;
	gap: 12px;
	align-items: start;
	padding: 18px 14px;
	border-radius: 28px;
	background:
		radial-gradient(110% 80% at 0% 0%, rgba(255, 205, 226, .85), transparent 60%),
		radial-gradient(90% 90% at 100% 100%, rgba(255, 232, 190, .7), transparent 60%),
		linear-gradient(160deg, #fff8fb, #fff4ea);
	border: 1px solid #f6d8e5;
	box-shadow: var(--rkg-shadow);
}
.rinka-fansite .rkg .rkg-stage__rinka { position: relative; }
.rinka-fansite .rkg .rkg-stage__face {
	display: block;
	width: 84px; height: 84px;
	border-radius: 50%;
	object-fit: cover;
	border: 3px solid #fff;
	box-shadow: 0 0 0 3px #ffa6c9, 0 10px 18px -6px rgba(217, 70, 138, .45);
	background: #ffe9f3;
}
.rinka-fansite .rkg .rkg-stage__talk { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.rinka-fansite .rkg .rkg-bubble {
	position: relative;
	margin: 0;
	padding: 12px 14px;
	border-radius: 18px 18px 18px 6px;
	background: #fff;
	border: 1px solid #f6d3e5;
	box-shadow: 0 6px 16px -8px rgba(176, 58, 116, .3);
	text-align: left;
	font-weight: 700;
}
.rinka-fansite .rkg .rkg-bubble::before {
	content: '';
	position: absolute;
	left: -7px; top: 22px;
	width: 12px; height: 12px;
	background: #fff;
	border-left: 1px solid #f6d3e5;
	border-bottom: 1px solid #f6d3e5;
	transform: rotate(45deg);
}
.rinka-fansite .rkg .rinka-fs-gifts__status-text { display: block; font-size: .95rem; line-height: 1.7; color: var(--rkg-ink); }
.rinka-fansite .rkg .rinka-fs-gifts__status-note { display: block; margin-top: 4px; font-size: .76rem; font-weight: 700; color: var(--rkg-rose-ink); }
.rinka-fansite .rkg .rkg-bubble .rinka-fs-reaction {
	display: block;
	margin: 0;
	padding: 0;
	max-width: none;
	border: 0;
	background: none;
	text-align: left;
	font-size: .95rem;
	line-height: 1.7;
}

.rinka-fansite .rkg .rkg-title__badge {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px 8px 8px;
	border-radius: 16px;
	background: linear-gradient(120deg, #fffaf0, #fff0f7);
	border: 1px solid #f5dcc0;
}
.rinka-fansite .rkg .rkg-title__ico { width: 34px; height: 34px; flex: none; }
.rinka-fansite .rkg .rkg-title__txt { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.rinka-fansite .rkg .rkg-title__txt small { font-size: .66rem; font-weight: 800; letter-spacing: .08em; color: #b0833a; }
.rinka-fansite .rkg .rkg-title__txt b { font-size: .98rem; font-weight: 900; color: var(--rkg-ink); overflow-wrap: anywhere; }
.rinka-fansite .rkg .rkg-title__n { font-size: .8rem; font-weight: 900; color: var(--rkg-rose); white-space: nowrap; font-variant-numeric: tabular-nums; }
.rinka-fansite .rkg .rkg-title__next { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; font-size: .74rem; color: var(--rkg-ink-soft); }
.rinka-fansite .rkg .rkg-title__bar { display: block; height: 7px; border-radius: 999px; background: #f7e4ee; overflow: hidden; }
.rinka-fansite .rkg .rkg-title__bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ffd36e, #ff8fbf); }

/* ---------- ② 贈りものカード ---------- */
.rinka-fansite .rkg .rkg-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}
.rinka-fansite .rkg .rkg-grid.is-result { display: block; }
.rinka-fansite .rkg .rkg-card {
	--rkg-fr-a: #f6e7ee; --rkg-fr-b: #e9cfdc;
	appearance: none;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 6px;
	width: 100%;
	margin: 0;
	padding: 6px 6px 10px;
	border: 0;
	border-radius: 22px;
	background: linear-gradient(160deg, var(--rkg-fr-a), var(--rkg-fr-b));
	box-shadow: 0 12px 24px -16px rgba(150, 60, 110, .55);
	color: var(--rkg-ink);
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: transform .25s cubic-bezier(.34, 1.56, .64, 1), box-shadow .25s ease;
}
.rinka-fansite .rkg .rkg-card--r { --rkg-fr-a: #e4f3ff; --rkg-fr-b: #bfe0ff; }
.rinka-fansite .rkg .rkg-card--sr { --rkg-fr-a: #efe8ff; --rkg-fr-b: #cdb9ff; }
.rinka-fansite .rkg .rkg-card--ssr { --rkg-fr-a: #fff4d4; --rkg-fr-b: #f5c65a; }
.rinka-fansite .rkg .rkg-card--ur { --rkg-fr-a: #ffd6ea; --rkg-fr-b: #c9b0ff; background: linear-gradient(135deg, #ffd0e6, #ffe9b0 30%, #c8f0ff 55%, #d6c4ff 80%, #ffc9e4); background-size: 200% 200%; animation: rkg-ur 6s ease-in-out infinite; }
@keyframes rkg-ur { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
button.rkg-card:hover { transform: translateY(-4px) rotate(-.4deg); box-shadow: 0 18px 30px -16px rgba(217, 70, 138, .6); }
button.rkg-card:focus-visible { outline: 3px solid rgba(217, 70, 138, .55); outline-offset: 3px; }
button.rkg-card:active { transform: scale(.97); }
.rinka-fansite .rkg .rkg-card__art {
	position: relative;
	display: block;
	aspect-ratio: 1;
	border-radius: 17px;
	overflow: hidden;
	background: #fff;
}
.rinka-fansite .rkg .rkg-card__art > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rinka-fansite .rkg .rkg-card__fallback { display: block; width: 60% !important; height: 60% !important; margin: 20%; object-fit: contain !important; }
.rinka-fansite .rkg .rkg-card__rarity {
	position: absolute;
	top: 8px; left: 8px;
	padding: 2px 9px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .92);
	font-family: var(--rinka-font-latin, system-ui, sans-serif);
	font-size: .7rem;
	font-weight: 900;
	letter-spacing: .06em;
	color: #9a6f86;
	box-shadow: 0 2px 6px rgba(120, 60, 90, .18);
}
.rinka-fansite .rkg .rkg-card--ssr .rkg-card__rarity { color: #b07a0c; }
.rinka-fansite .rkg .rkg-card--ur .rkg-card__rarity { color: #fff; background: linear-gradient(90deg, #ff7fb4, #b58cff); }
.rinka-fansite .rkg .rkg-card__limited {
	position: absolute;
	top: 8px; right: 8px;
	padding: 2px 8px;
	border-radius: 999px;
	background: #ff6fa8;
	color: #fff;
	font-size: .66rem;
	font-weight: 900;
}
.rinka-fansite .rkg .rkg-card__away {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	background: rgba(74, 53, 64, .42);
	backdrop-filter: blur(2px);
	color: #fff;
	font-size: .76rem;
	font-weight: 900;
	text-align: center;
}
.rinka-fansite .rkg .rkg-card__lock { width: 40px; height: 40px; }
.rinka-fansite .rkg .rkg-card.is-rare-away { cursor: default; opacity: 1; filter: none; }
.rinka-fansite .rkg .rkg-card.is-rare-away .rkg-card__art > img { filter: blur(6px) grayscale(.6); transform: scale(1.15); }
.rinka-fansite .rkg .rkg-card__name { padding: 0 6px; font-size: .92rem; font-weight: 900; line-height: 1.35; }
.rinka-fansite .rkg .rkg-card__desc {
	padding: 0 6px;
	font-size: .72rem;
	line-height: 1.5;
	color: var(--rkg-ink-soft);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.rinka-fansite .rkg .rkg-card__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; padding: 0 6px; margin-top: auto; }
.rinka-fansite .rkg .rkg-card__aff {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 2px 8px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .9);
	font-size: .72rem;
	font-weight: 900;
	color: var(--rkg-rose);
}
.rinka-fansite .rkg .rkg-pref {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: .68rem;
	font-weight: 900;
	white-space: nowrap;
}
.rinka-fansite .rkg .rkg-pref--love { background: linear-gradient(90deg, #ff6fa8, #ff9cc5); color: #fff; }
.rinka-fansite .rkg .rkg-pref--like { background: #ffe3ef; color: #c2437d; }
.rinka-fansite .rkg .rkg-pref--normal { background: #f1ecef; color: #86737e; }
.rinka-fansite .rkg .rkg-pref--unknown { background: rgba(255, 255, 255, .75); color: #a7939e; border: 1px dashed #dcc6d2; }

/* ---------- 箱（包み紙＋リボン） ---------- */
.rkg-box { --s: 120px; position: relative; width: var(--s); height: var(--s); flex: none; }
.rkg-box--big { --s: 150px; }
.rkg-box--small { --s: 70px; }
.rkg-box__body {
	position: absolute;
	left: 8%; right: 8%; bottom: 0;
	height: 58%;
	border-radius: 9% 9% 12% 12% / 14% 14% 16% 16%;
	background: var(--paper, #ff9cc5);
	box-shadow: inset 0 -8px 0 rgba(0, 0, 0, .06), inset 0 10px 12px -8px rgba(0, 0, 0, .18), 0 10px 18px -10px rgba(120, 40, 80, .5);
	overflow: hidden;
}
.rkg-box__lid {
	position: absolute;
	left: 2%; right: 2%;
	top: 26%;
	height: 20%;
	border-radius: 12% / 30%;
	background: var(--paper, #ff9cc5);
	box-shadow: inset 0 -6px 0 rgba(0, 0, 0, .08), inset 0 4px 0 rgba(255, 255, 255, .35), 0 6px 10px -6px rgba(120, 40, 80, .45);
	overflow: hidden;
	z-index: 2;
	transform-origin: 20% 100%;
	transition: transform .55s cubic-bezier(.3, 1.4, .5, 1), opacity .45s ease;
}
.rkg-box__band {
	position: absolute;
	top: 0; bottom: 0;
	left: 50%;
	width: 16%;
	transform: translateX(-50%);
	background: linear-gradient(90deg, var(--rb, #ff5f9e), var(--rb2, #ff9cc5) 45%, var(--rb, #ff5f9e));
	box-shadow: 0 0 0 1px rgba(0, 0, 0, .05);
}
.rkg-box__bow {
	position: absolute;
	left: 50%; top: 6%;
	width: 62%; height: 26%;
	transform: translateX(-50%);
	z-index: 3;
	transition: transform .45s cubic-bezier(.5, -0.4, .6, 1.4), opacity .4s ease;
}
.rkg-box__bow i {
	position: absolute;
	top: 8%;
	width: 50%; height: 84%;
	border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
	border: calc(var(--s) * .05) solid var(--rb, #ff5f9e);
	background: var(--rb2, #ff9cc5);
	box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .08);
}
.rkg-box__bow i:first-child { left: 0; transform: rotate(-24deg); transform-origin: 100% 50%; }
.rkg-box__bow i:nth-child(2) { right: 0; transform: rotate(24deg); transform-origin: 0% 50%; }
.rkg-box__bow b {
	position: absolute;
	left: 50%; top: 50%;
	width: 22%; height: 58%;
	transform: translate(-50%, -30%);
	border-radius: 40%;
	background: var(--rb, #ff5f9e);
	box-shadow: inset 0 2px 0 rgba(255, 255, 255, .45);
}
.rkg-ribbon--white .rkg-box__bow i, .rkg-ribbon--white .rkg-box__bow b, .rkg-ribbon--white .rkg-box__band { box-shadow: 0 0 0 1px rgba(160, 120, 140, .35); }
.rkg-box__item {
	position: absolute;
	left: 18%; right: 18%;
	bottom: 18%;
	aspect-ratio: 1;
	border-radius: 18px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 8px 20px -6px rgba(217, 70, 138, .6);
	transform: translateY(10%) scale(.5);
	opacity: 0;
	z-index: 1;
	transition: transform .7s cubic-bezier(.3, 1.5, .5, 1) .15s, opacity .3s ease .15s;
}
.rkg-box__item img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rkg-box.is-giving { animation: rkg-shake .85s ease-in-out both; }
@keyframes rkg-shake {
	0%, 100% { transform: rotate(0); }
	15% { transform: rotate(-7deg) translateY(-2px); }
	30% { transform: rotate(6deg); }
	45% { transform: rotate(-5deg) translateY(-3px); }
	60% { transform: rotate(4deg); }
	75% { transform: rotate(-2deg); }
}
.rkg-box.is-open .rkg-box__bow { transform: translateX(-50%) translateY(-40%) scale(.2) rotate(40deg); opacity: 0; }
.rkg-box.is-open .rkg-box__lid { transform: translate(-30%, -150%) rotate(-28deg); opacity: 0; }
.rkg-box.is-open .rkg-box__item { transform: translateY(-62%) scale(1); opacity: 1; z-index: 4; }
.rkg-box--small .rkg-box__bow i { border-width: 3px; }

/* ---------- ③ ラッピングの画面（スマホ＝下から出る／PC＝まんなか） ---------- */
html.rkg-lock, html.rkg-lock body { overflow: hidden; }
.rkg-wrapdlg[hidden] { display: none !important; }
.rkg-wrapdlg {
	position: fixed;
	inset: 0;
	z-index: 10060;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}
.rkg-wrapdlg__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(60, 30, 50, .45);
	backdrop-filter: blur(3px);
	opacity: 0;
	transition: opacity .25s ease;
}
.rkg-wrapdlg.is-open .rkg-wrapdlg__backdrop { opacity: 1; }
.rkg-wrapdlg__panel {
	position: relative;
	width: min(560px, 100%);
	max-height: 92vh;
	max-height: 92dvh;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: 18px 16px calc(18px + env(safe-area-inset-bottom, 0px));
	border-radius: 28px 28px 0 0;
	background:
		radial-gradient(100% 50% at 50% 0%, rgba(255, 214, 233, .9), transparent 70%),
		linear-gradient(180deg, #fffafd, #fff);
	box-shadow: 0 -18px 40px -12px rgba(120, 40, 80, .45);
	color: #4a3540;
	transform: translateY(40px);
	opacity: 0;
	transition: transform .35s cubic-bezier(.22, .9, .25, 1), opacity .25s ease;
}
.rkg-wrapdlg.is-open .rkg-wrapdlg__panel { transform: none; opacity: 1; }
.rkg-wrapdlg__x {
	position: absolute;
	top: 10px; right: 10px;
	width: 44px; height: 44px;
	border: 0;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 2px 8px rgba(120, 60, 90, .2);
	cursor: pointer;
}
.rkg-wrapdlg__x span, .rkg-wrapdlg__x span::before {
	position: absolute;
	left: 50%; top: 50%;
	width: 16px; height: 2.5px;
	border-radius: 2px;
	background: #b3336f;
	transform: translate(-50%, -50%) rotate(45deg);
	content: '';
}
.rkg-wrapdlg__x span::before { transform: translate(-50%, -50%) rotate(90deg); }
.rkg-wrapdlg .rkg-h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; font-size: 1.1rem; font-weight: 900; }
.rkg-wrapdlg .rkg-h2__icon { width: 34px; height: 34px; }
.rkg-wrap__preview {
	display: grid;
	place-items: center;
	height: 210px;
	margin: 0 0 6px;
	border-radius: 22px;
	background: radial-gradient(60% 50% at 50% 70%, rgba(255, 190, 220, .5), transparent 70%), repeating-conic-gradient(from 0deg at 50% 70%, rgba(255, 255, 255, .0) 0 10deg, rgba(255, 230, 242, .6) 10deg 20deg);
}
.rkg-wrap__preview .rkg-box { margin-top: 30px; }
.rkg-wrap__gift { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; margin: 0 0 10px; font-size: .95rem; }
.rkg-wrap__gift b { font-weight: 900; }
.rkg-wrap__rar { padding: 1px 8px; border-radius: 999px; background: #f3e7ee; font-size: .7rem; font-weight: 900; color: #9a6f86; }
.rkg-wrapdlg .rkg-card__aff { display: inline-flex; align-items: center; gap: 3px; padding: 2px 8px; border-radius: 999px; background: #fff0f6; font-size: .72rem; font-weight: 900; color: #d9468a; }
.rkg-wrapdlg .rkg-heart { width: 13px; height: 12px; fill: currentColor; }
.rkg-wrapdlg .rkg-pref { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: .68rem; font-weight: 900; }
.rkg-wrapdlg .rkg-pref--love { background: linear-gradient(90deg, #ff6fa8, #ff9cc5); color: #fff; }
.rkg-wrapdlg .rkg-pref--like { background: #ffe3ef; color: #c2437d; }
.rkg-wrapdlg .rkg-pref--normal { background: #f1ecef; color: #86737e; }
.rkg-pick { margin: 0 0 10px; padding: 0; border: 0; min-width: 0; }
.rkg-pick legend { padding: 0; margin: 0 0 6px; font-size: .78rem; font-weight: 900; letter-spacing: .08em; color: #b3336f; }
.rkg-pick__row { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; padding: 2px 2px 6px; }
.rkg-swatch {
	appearance: none;
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	min-width: 58px;
	min-height: 44px;
	padding: 6px 6px 5px;
	border: 2px solid transparent;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 2px 8px rgba(120, 60, 90, .12);
	font: inherit;
	font-size: .7rem;
	font-weight: 800;
	color: #4a3540;
	cursor: pointer;
	transition: transform .2s cubic-bezier(.34, 1.56, .64, 1), border-color .2s ease;
}
.rkg-swatch:hover { transform: translateY(-2px); }
.rkg-swatch:focus-visible { outline: 3px solid rgba(217, 70, 138, .5); outline-offset: 2px; }
.rkg-swatch.is-on { border-color: #ff6fa8; box-shadow: 0 6px 14px -6px rgba(217, 70, 138, .6); }
.rkg-swatch__chip { display: block; width: 40px; height: 28px; border-radius: 9px; background: var(--paper); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .06); }
.rkg-swatch--ribbon .rkg-swatch__chip { background: linear-gradient(90deg, transparent 38%, var(--rb) 38% 62%, transparent 62%), linear-gradient(transparent 38%, var(--rb) 38% 62%, transparent 62%), #fbf4f8; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); }
.rkg-wrap__actions { display: flex; gap: 10px; margin: 6px 0 8px; }
.rkg-wrap__opening { margin: 4px 0; text-align: center; font-weight: 900; color: #b3336f; animation: rkg-blink 1s ease-in-out infinite; }
@keyframes rkg-blink { 50% { opacity: .45; } }
.rkg-wrap__note { margin: 0; font-size: .72rem; line-height: 1.6; color: #7a6470; text-align: center; }

.rkg-btn {
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 48px;
	padding: 10px 20px;
	border: 0;
	border-radius: 999px;
	font: inherit;
	font-size: .92rem;
	font-weight: 900;
	white-space: nowrap;
	cursor: pointer;
	transition: transform .2s cubic-bezier(.34, 1.56, .64, 1), box-shadow .2s ease, opacity .2s ease;
}
.rkg-btn:focus-visible { outline: 3px solid rgba(217, 70, 138, .55); outline-offset: 3px; }
.rkg-btn:disabled { opacity: .55; cursor: default; }
.rkg-btn--ghost { flex: 0 0 auto; padding-inline: 16px; background: #fff; color: #b3336f; box-shadow: inset 0 0 0 2px #f5c6db; }
.rkg-btn--give { flex: 1 1 auto; background: linear-gradient(120deg, #ff7fb4, #ff5f9e 50%, #c98cff); color: #fff; box-shadow: 0 10px 22px -8px rgba(217, 70, 138, .75); }
.rkg-btn--give:hover:not(:disabled) { transform: translateY(-2px); }
.rkg-btn__ico { width: 28px; height: 28px; }

/* ---------- きょうのおくりもの・おかえし ---------- */
.rinka-fansite .rkg .rkg-result { display: flex; flex-direction: column; gap: 14px; }
.rinka-fansite .rkg .rkg-result__gift {
	display: grid;
	grid-template-columns: 88px 1fr;
	gap: 12px;
	align-items: center;
	padding: 10px;
	border-radius: 20px;
	background: var(--rkg-soft);
	border: 1px solid #f7e0ec;
}
.rinka-fansite .rkg .rkg-result__art { display: block; width: 88px; height: 88px; border-radius: 18px; overflow: hidden; background: #fff; box-shadow: 0 6px 14px -8px rgba(217, 70, 138, .6); }
.rinka-fansite .rkg .rkg-result__art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rinka-fansite .rkg .rkg-result__meta { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.rinka-fansite .rkg .rkg-result__meta b { font-size: 1.05rem; font-weight: 900; }
.rinka-fansite .rkg .rkg-result__meta > span { font-size: .76rem; color: var(--rkg-ink-soft); }
.rinka-fansite .rkg .rkg-result__aff { display: inline-flex !important; align-items: center; gap: 4px; align-self: flex-start; padding: 2px 10px; border-radius: 999px; background: #fff; color: var(--rkg-rose) !important; font-weight: 900; }
.rinka-fansite .rkg .rkg-result__tomorrow { display: flex; align-items: center; justify-content: center; margin: 0; font-size: .8rem; color: var(--rkg-ink-soft); }

.rinka-fansite .rkg .rkg-return.rinka-fs-gifts__wrap {
	gap: 8px;
	padding: 20px 16px 18px;
	border: 0;
	border-radius: 22px;
	background:
		radial-gradient(80% 60% at 50% 0%, rgba(255, 255, 255, .85), transparent 70%),
		linear-gradient(150deg, #ffe4f0, #fff0d8);
	box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .7), 0 10px 22px -14px rgba(217, 70, 138, .6);
}
.rinka-fansite .rkg .rkg-return .rkg-box { animation: rkg-bob 2.4s ease-in-out infinite; }
@keyframes rkg-bob { 0%, 100% { transform: rotate(-4deg) translateY(0); } 50% { transform: rotate(4deg) translateY(-4px); } }
.rinka-fansite .rkg .rinka-fs-gifts__wrap-btn { background: linear-gradient(120deg, #ff7fb4, #ff5f9e 50%, #c98cff); box-shadow: 0 10px 22px -8px rgba(217, 70, 138, .75); }

.rinka-fansite .rkg .rkg-react {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 14px;
	border-radius: 22px;
	background: linear-gradient(150deg, #fff5fa, #f7f1ff);
	border: 1px solid #f3d6e6;
}
.rinka-fansite .rkg .rkg-react.is-enter { animation: rkg-pop .6s cubic-bezier(.2, 1.3, .4, 1) both; }
@keyframes rkg-pop { 0% { opacity: 0; transform: translateY(10px) scale(.95); } 100% { opacity: 1; transform: none; } }
.rinka-fansite .rkg .rkg-react--joy3 { background: radial-gradient(90% 60% at 50% 0%, rgba(255, 225, 150, .55), transparent 70%), linear-gradient(150deg, #fff3f8, #f5eeff); border-color: #f5d49a; }
.rinka-fansite .rkg .rkg-react__head { display: flex; align-items: center; gap: 12px; }
.rinka-fansite .rkg .rkg-react__face {
	width: 76px; height: 76px;
	border-radius: 50%;
	object-fit: cover;
	border: 3px solid #fff;
	box-shadow: 0 0 0 3px #ffa6c9, 0 8px 16px -6px rgba(217, 70, 138, .5);
	flex: none;
}
.rinka-fansite .rkg .rkg-react--joy3 .rkg-react__face { box-shadow: 0 0 0 3px #ffd36e, 0 0 22px rgba(255, 190, 90, .7); }
.rinka-fansite .rkg .rkg-react__joy { display: flex; flex-direction: column; gap: 3px; }
.rinka-fansite .rkg .rkg-react__joy small { font-size: .68rem; font-weight: 800; letter-spacing: .08em; color: var(--rkg-ink-soft); }
.rinka-fansite .rkg .rkg-react__joy b { font-size: 1.1rem; font-weight: 900; color: var(--rkg-rose-ink); }
.rinka-fansite .rkg .rkg-joy { display: inline-flex; gap: 3px; }
.rinka-fansite .rkg .rkg-joy__h { display: inline-grid; color: #efd9e4; }
.rinka-fansite .rkg .rkg-joy__h .rkg-heart { width: 20px; height: 18px; }
.rinka-fansite .rkg .rkg-joy__h.is-on { color: #ff5f9e; filter: drop-shadow(0 2px 3px rgba(255, 95, 158, .45)); }
.rinka-fansite .rkg .rkg-react.is-enter .rkg-joy__h.is-on { animation: rkg-heartin .5s cubic-bezier(.3, 1.6, .5, 1) both; }
.rinka-fansite .rkg .rkg-react.is-enter .rkg-joy__h.is-on:nth-child(2) { animation-delay: .15s; }
.rinka-fansite .rkg .rkg-react.is-enter .rkg-joy__h.is-on:nth-child(3) { animation-delay: .3s; }
@keyframes rkg-heartin { 0% { transform: scale(0); } 100% { transform: scale(1); } }
.rinka-fansite .rkg .rkg-react__art.rinka-fs-reaction-art { width: min(260px, 86%); margin: 0 auto; border-radius: 20px; }
.rinka-fansite .rkg .rkg-react__text.rinka-fs-reaction {
	position: relative;
	margin: 0;
	max-width: none;
	padding: 12px 14px;
	border: 0;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 6px 14px -10px rgba(176, 58, 116, .5);
	font-size: .98rem;
	text-align: left;
}
.rinka-fansite .rkg .rkg-react__pref { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 0; font-size: .8rem; color: var(--rkg-ink-soft); }

/* ---------- ④ 図鑑 ---------- */
.rinka-fansite .rkg .rkg-book__sum { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "count love" "bar bar"; align-items: center; gap: 6px 12px; margin: 0 0 12px; }
.rinka-fansite .rkg .rkg-book__count { grid-area: count; font-size: .9rem; font-weight: 800; color: var(--rkg-ink-soft); }
.rinka-fansite .rkg .rkg-book__count b { font-size: 1.5rem; font-weight: 900; color: var(--rkg-rose); }
.rinka-fansite .rkg .rkg-book__count small { margin-left: 6px; font-size: .72rem; }
.rinka-fansite .rkg .rkg-book__love { grid-area: love; justify-self: end; font-size: .76rem; font-weight: 800; color: var(--rkg-ink-soft); }
.rinka-fansite .rkg .rkg-book__love b { color: var(--rkg-rose); font-size: 1rem; }
.rinka-fansite .rkg .rkg-book__bar { grid-area: bar; display: block; height: 9px; border-radius: 999px; background: #f7e4ee; overflow: hidden; }
.rinka-fansite .rkg .rkg-book__bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ffb3d1, #ff6fa8, #c98cff); }
.rinka-fansite .rkg .rkg-book__grid { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.rinka-fansite .rkg .rkg-bk { margin: 0; padding: 6px 6px 8px; border-radius: 18px; background: #faf6f8; border: 1px dashed #e6d2dd; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; }
.rinka-fansite .rkg .rkg-bk::before, .rinka-fansite .rkg .rkg-bk::after { display: none; }
.rinka-fansite .rkg .rkg-bk.is-got { background: #fff; border: 1px solid #f3d3e3; box-shadow: 0 8px 16px -12px rgba(217, 70, 138, .55); }
.rinka-fansite .rkg .rkg-bk__art { position: relative; display: block; width: 100%; aspect-ratio: 1; border-radius: 14px; overflow: hidden; background: #f3eaef; }
.rinka-fansite .rkg .rkg-bk__art > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rinka-fansite .rkg .rkg-bk:not(.is-got) .rkg-bk__art > img { filter: blur(7px) grayscale(1) contrast(.8); opacity: .5; transform: scale(1.2); }
.rinka-fansite .rkg .rkg-bk__lock { position: absolute; inset: 0; margin: auto; width: 40px; height: 40px; filter: drop-shadow(0 2px 4px rgba(90, 58, 102, .35)); }
.rinka-fansite .rkg .rkg-bk__rar { position: absolute; top: 5px; left: 5px; padding: 1px 6px; border-radius: 999px; background: rgba(255, 255, 255, .9); font-size: .6rem; font-weight: 900; color: #9a6f86; }
.rinka-fansite .rkg .rkg-bk--ssr .rkg-bk__rar { color: #b07a0c; }
.rinka-fansite .rkg .rkg-bk--ur .rkg-bk__rar { color: #fff; background: linear-gradient(90deg, #ff7fb4, #b58cff); }
.rinka-fansite .rkg .rkg-bk__n { position: absolute; right: 5px; bottom: 5px; padding: 1px 7px; border-radius: 999px; background: #ff6fa8; color: #fff; font-size: .66rem; font-weight: 900; }
.rinka-fansite .rkg .rkg-bk__name { font-size: .78rem; font-weight: 900; line-height: 1.3; overflow-wrap: anywhere; }
.rinka-fansite .rkg .rkg-bk:not(.is-got) .rkg-bk__name { color: #b7a4ae; letter-spacing: .1em; }
.rinka-fansite .rkg .rkg-bk__date { font-size: .62rem; color: var(--rkg-ink-soft); }
.rinka-fansite .rkg .rkg-book__hint { display: flex; align-items: flex-start; gap: 2px; margin: 12px 0 0; font-size: .76rem; line-height: 1.6; color: var(--rkg-ink-soft); }

/* ---------- ⑤ 日記 ---------- */
.rinka-fansite .rkg .rkg-log__list { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.rinka-fansite .rkg .rkg-log__item {
	display: grid;
	grid-template-columns: 46px 44px 1fr auto;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 6px 10px 6px 6px;
	border-radius: 16px;
	background: var(--rkg-soft);
	border: 1px solid #f7e0ec;
}
.rinka-fansite .rkg .rkg-log__item::before { display: none; }
.rinka-fansite .rkg .rkg-log__date { font-size: .78rem; font-weight: 900; color: var(--rkg-rose-ink); text-align: center; font-variant-numeric: tabular-nums; }
.rinka-fansite .rkg .rkg-log__art { width: 44px; height: 44px; border-radius: 12px; overflow: hidden; background: #fff; }
.rinka-fansite .rkg .rkg-log__art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rinka-fansite .rkg .rkg-log__name { font-size: .86rem; font-weight: 800; min-width: 0; overflow-wrap: anywhere; }
.rinka-fansite .rkg .rkg-log__item .rkg-joy__h .rkg-heart { width: 14px; height: 13px; }
.rinka-fansite .rkg .rkg-log__empty { margin: 0; font-size: .86rem; color: var(--rkg-ink-soft); text-align: center; }

/* ---------- きらきら（自前・絵文字なし） ---------- */
.rkg-burst { position: fixed; z-index: 10070; width: 0; height: 0; pointer-events: none; }
.rkg-burst__p {
	position: absolute;
	left: -8px; top: -8px;
	width: 16px; height: 16px;
	color: #ff6fa8;
	animation: rkg-fly 1.3s cubic-bezier(.2, .8, .3, 1) var(--d, 0ms) both;
}
.rkg-burst__p .rkg-heart { width: 100%; height: 100%; fill: currentColor; }
.rkg-burst__p:nth-child(4n+2) { color: #ffb3d1; }
.rkg-burst__p:nth-child(4n+3) { color: #c98cff; }
.rkg-burst__p.is-star { width: 12px; height: 12px; left: -6px; top: -6px; background: #ffd36e; clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); }
@keyframes rkg-fly {
	0% { transform: translate(0, 0) scale(.3); opacity: 0; }
	15% { opacity: 1; }
	100% { transform: translate(var(--dx), var(--dy)) scale(1.1) rotate(25deg); opacity: 0; }
}

/* ---------- 横持ち・PC ---------- */
@media (min-width: 560px) {
	.rinka-fansite .rkg .rkg-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.rinka-fansite .rkg .rkg-book__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
	.rinka-fansite .rkg .rkg-log__list { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 760px) {
	.rinka-fansite .rkg .rkg-stage { grid-template-columns: 110px 1fr; padding: 22px 24px; }
	.rinka-fansite .rkg .rkg-stage__face { width: 110px; height: 110px; }
	.rinka-fansite .rkg .rkg-stage__talk { flex-direction: row; align-items: stretch; }
	.rinka-fansite .rkg .rkg-bubble { flex: 1 1 60%; }
	.rinka-fansite .rkg .rkg-title { flex: 0 0 min(300px, 40%); }
	.rinka-fansite .rkg .rkg-block { padding: 24px; }
	.rinka-fansite .rkg .rkg-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
	.rinka-fansite .rkg .rkg-result { display: grid; grid-template-columns: minmax(260px, 1fr) 1.3fr; align-items: start; }
	.rinka-fansite .rkg .rkg-result__tomorrow { grid-column: 1 / -1; }
	.rkg-wrapdlg { align-items: center; }
	.rkg-wrapdlg__panel { border-radius: 28px; padding: 22px 24px; }
}
@media (max-height: 500px) and (orientation: landscape) {
	.rkg-wrapdlg { align-items: center; }
	.rkg-wrapdlg__panel { width: min(760px, 96vw); border-radius: 24px; display: grid; grid-template-columns: 220px 1fr; gap: 0 16px; }
	.rkg-wrapdlg__title { grid-column: 1 / -1; }
	.rkg-wrapdlg__body { display: contents; }
	.rkg-wrap__preview { grid-row: span 5; height: auto; min-height: 200px; }
}

/* ---------- ダーク ---------- */
@media (prefers-color-scheme: dark) {
	.rinka-fansite .rkg { --rkg-ink: #f3e4ec; --rkg-ink-soft: #c9b3bf; --rkg-rose: #ff86bb; --rkg-rose-ink: #ff9cc8; --rkg-card: #2a2027; --rkg-line: #45323d; --rkg-soft: #33262e; }
	.rinka-fansite .rkg .rkg-stage { background: radial-gradient(110% 80% at 0% 0%, rgba(150, 60, 110, .45), transparent 60%), linear-gradient(160deg, #2b1f28, #2a2320); border-color: #4a3342; }
	.rinka-fansite .rkg .rkg-bubble, .rinka-fansite .rkg .rkg-bubble::before { background: #33262e; border-color: #4a3342; }
	.rinka-fansite .rkg .rkg-title__badge { background: #33262e; border-color: #5a4630; }
	.rinka-fansite .rkg .rkg-bk { background: #2a2027; border-color: #45323d; }
	.rinka-fansite .rkg .rkg-bk.is-got, .rinka-fansite .rkg .rkg-react__text.rinka-fs-reaction { background: #33262e; }
	.rinka-fansite .rkg .rkg-react { background: #2f2530; border-color: #4a3342; }
}

/* ---------- 動きをへらす ---------- */
@media (prefers-reduced-motion: reduce) {
	.rinka-fansite .rkg .rkg-card--ur,
	.rinka-fansite .rkg .rkg-return .rkg-box,
	.rinka-fansite .rkg .rkg-react.is-enter,
	.rinka-fansite .rkg .rkg-react.is-enter .rkg-joy__h.is-on,
	.rkg-box.is-giving,
	.rkg-wrap__opening { animation: none !important; }
	.rinka-fansite .rkg .rkg-card,
	.rkg-box__lid, .rkg-box__bow, .rkg-box__item,
	.rkg-wrapdlg__panel, .rkg-wrapdlg__backdrop,
	.rkg-swatch, .rkg-btn { transition: none !important; }
	.rkg-burst { display: none; }
}
