/* ============================================================
 * rinka-world-2026.css — りんかワールド デザイン刷新2026（追加のみ・撤収可能）
 *
 * ・読み込みは inc/rinka-world-2026.php（既存CSSのあと＝依存に既存ハンドルを指定）。
 * ・効くのは body.rw26 が付いたページだけ。ゲームのプレイ画面（/mofu-island/ /yukidoke/
 *   /mogumogu/ /purupuru/ /pokapoka/ /byunbyun/ /hidamari/ とノベル）には PHP が rw26 を
 *   付けない＝このCSS自体が読まれない。/games/ は rw26-calm（動きを控えめ）。
 * ・既存の見た目は「別物」にしない。パステル・うさぎ・やわらかさを磨くだけ。
 * ・最新機能（@property / oklch / color-mix / :has / container queries /
 *   scroll-driven animations / @starting-style / View Transitions / text-wrap）は
 *   @supports で段階的に。古いブラウザでは今までどおりの見た目で止まる。
 * ・prefers-reduced-motion: reduce では動きを全部止める（最下部）。
 * ・@layer は使わない（既存の無レイヤーCSSに負けるため）。
 * 撤収: functions.php の require 1行を消すだけ。
 * ========================================================== */

/* ---------- 0. トークン ---------- */
@property --rw26-xp {
	syntax: '<number>';
	inherits: true;
	initial-value: 0;
}

body.rw26 {
	--rw26-pink: #ff8fbf;
	--rw26-rose: #e0588f;
	--rw26-rose-ink: #b83a72;   /* 白地で 5.6:1（AA） */
	--rw26-lav: #b9a3ff;
	--rw26-mint: #86dcc6;
	--rw26-sky: #9fd0ff;
	--rw26-butter: #ffe08a;
	--rw26-ink: var(--rinka-ink, #4a3540);
	--rw26-ink-soft: #76606c;   /* 既存 #8a7580 より少し濃く（白地 5.5:1） */
	--rw26-card: #ffffff;
	--rw26-card-line: #f4d9e6;
	--rw26-canvas: #fbf5f9;
	--rw26-shadow-sm: 0 2px 8px rgba(184, 58, 114, .08);
	--rw26-shadow: 0 10px 30px -8px rgba(184, 58, 114, .18), 0 2px 6px rgba(184, 58, 114, .06);
	--rw26-shadow-lg: 0 24px 60px -18px rgba(150, 60, 120, .32);
	--rw26-radius: 22px;
	--rw26-radius-lg: 30px;
	--rw26-spring: cubic-bezier(.34, 1.56, .64, 1);
	--rw26-ease: cubic-bezier(.22, .8, .24, 1);
	--rw26-nav-h: 64px;
	--rw26-safe-b: env(safe-area-inset-bottom, 0px);
	--rw26-grad: linear-gradient(120deg, #ff8fbf, #c9a2ff 55%, #8fd6ff);
	/* 読みやすさ: 既存の淡いサブ文字色を少しだけ濃く（コントラスト AA 目安） */
	--rinka-ink-soft: #76606c;
}
@supports (color: oklch(70% .1 350)) {
	body.rw26 {
		--rw26-pink: oklch(78% .13 355);
		--rw26-rose: oklch(64% .17 355);
		--rw26-lav: oklch(76% .12 295);
		--rw26-mint: oklch(84% .09 172);
		--rw26-sky: oklch(83% .08 240);
		--rw26-grad: linear-gradient(120deg in oklch, oklch(80% .12 355), oklch(78% .12 300) 55%, oklch(84% .08 235));
	}
}

/* ---------- 1. ページ移動をなめらかに（View Transitions・対応ブラウザだけ） ---------- */
@media (prefers-reduced-motion: no-preference) {
	@view-transition { navigation: auto; }
}
::view-transition-old(root) { animation: rw26-vt-out .22s var(--rw26-ease, ease) both; }
::view-transition-new(root) { animation: rw26-vt-in .32s var(--rw26-ease, ease) both; }
@keyframes rw26-vt-out { to { opacity: 0; transform: scale(.985); } }
@keyframes rw26-vt-in { from { opacity: 0; transform: translateY(10px) scale(1.01); } }
body.rw26 .rinka-bottom-nav { view-transition-name: rw26-nav; }
::view-transition-group(rw26-nav) { animation-duration: 0s; }

/* ---------- 2. 背景：ゆっくり動くパステルのオーロラ＋きらめき（とても控えめ） ---------- */
body.rw26 { background-color: var(--rw26-canvas); }
body.rw26::before,
body.rw26::after {
	content: '';
	position: fixed;
	inset: -10vmax;
	z-index: -1;
	pointer-events: none;
}
body.rw26::before {
	background:
		radial-gradient(38vmax 30vmax at 12% 8%, rgba(255, 170, 205, .34), transparent 70%),
		radial-gradient(34vmax 28vmax at 92% 18%, rgba(196, 170, 255, .30), transparent 70%),
		radial-gradient(40vmax 32vmax at 70% 96%, rgba(150, 214, 255, .26), transparent 70%),
		radial-gradient(30vmax 26vmax at 6% 88%, rgba(255, 226, 150, .24), transparent 70%);
	animation: rw26-aurora 38s ease-in-out infinite alternate;
	will-change: transform;
}
body.rw26::after {
	/* 1タイル(520px)ぶん外側まで広げて、transform だけでゆっくり流す＝毎フレームの描き直しなし */
	inset: -520px 0 0 -520px;
	opacity: .55;
	background-image:
		radial-gradient(1.6px 1.6px at 12% 22%, #fff 60%, transparent 62%),
		radial-gradient(2px 2px at 78% 12%, #ffd6ea 60%, transparent 62%),
		radial-gradient(1.4px 1.4px at 44% 64%, #fff 60%, transparent 62%),
		radial-gradient(2.2px 2.2px at 88% 72%, #e5d8ff 60%, transparent 62%),
		radial-gradient(1.6px 1.6px at 24% 86%, #fff3c4 60%, transparent 62%),
		radial-gradient(1.8px 1.8px at 62% 34%, #ffe1f0 60%, transparent 62%);
	background-size: 520px 520px;
	animation: rw26-twinkle 7s ease-in-out infinite alternate, rw26-drift 90s linear infinite;
	will-change: transform, opacity;
}
@keyframes rw26-aurora {
	0%   { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
	50%  { transform: translate3d(3vmax, -2vmax, 0) rotate(6deg) scale(1.05); }
	100% { transform: translate3d(-2vmax, 2vmax, 0) rotate(-4deg) scale(1.02); }
}
@keyframes rw26-twinkle { from { opacity: .25; } to { opacity: .7; } }
@keyframes rw26-drift { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(520px, 520px, 0); } }

/* ---------- 3. ヘッダー：やわらかいグラデの帯と、ぷっくりロゴ ---------- */
body.rw26 #header-container {
	position: relative;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(255, 255, 255, .78)),
		var(--rw26-grad);
	border-bottom: 1px solid rgba(244, 217, 230, .8);
}
body.rw26 #header-container::after {
	content: '';
	position: absolute;
	left: 0; right: 0; bottom: -1px;
	height: 3px;
	background: linear-gradient(90deg, #ff8fbf, #c9a2ff, #8fd6ff, #ffd08a, #ff8fbf);
	background-size: 200% 100%;
	animation: rw26-ribbon 12s linear infinite;
	opacity: .85;
}
@keyframes rw26-ribbon { to { background-position: 200% 0; } }
body.rw26 #header .site-name-text {
	font-weight: 900;
	letter-spacing: .08em;
	background: linear-gradient(100deg, #d9467f, #a86ce0 60%, #5a9be0);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	transition: letter-spacing .5s var(--rw26-spring);
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
	body.rw26 #header .site-name-text { color: var(--rw26-rose-ink); background: none; }
}
@media (hover: hover) {
	body.rw26 #header .site-name:hover .site-name-text { letter-spacing: .14em; }
}
body.rw26 #header .tagline { color: var(--rw26-ink-soft); letter-spacing: .06em; }
body.rw26 #navi,
body.rw26 #navi .navi-in { background: transparent; }
body.rw26 #navi .menu-top > li > a {
	border-radius: 999px;
	transition: background-color .25s ease, color .25s ease, scale .4s var(--rw26-spring);
}
@media (hover: hover) {
	body.rw26 #navi .menu-top > li > a:hover {
		background-color: rgba(255, 143, 191, .14);
		color: var(--rw26-rose-ink);
		scale: 1.04;
	}
}

/* ---------- 4. 本文の箱：角をまるく・影をやわらかく ---------- */
@media (min-width: 834px) {
	body.rw26 .main,
	body.rw26 #sidebar.sidebar {
		border-radius: var(--rw26-radius-lg);
		box-shadow: var(--rw26-shadow);
		border: 1px solid rgba(244, 217, 230, .7);
	}
}
@media (max-width: 833px) {
	body.rw26 .main { border-radius: 26px 26px 0 0; }
}
body.rw26 .footer,
body.rw26 #footer {
	background: linear-gradient(180deg, rgba(255, 255, 255, .6), #fff 40%);
	border-top: 1px solid rgba(244, 217, 230, .8);
}

/* ---------- 5. 文字：見出しの階層と、読みやすい折り返し ---------- */
body.rw26 :is(.entry-title, .rinka-section__title, .rinka-fs-head__title, .rinka-fs-navgroup__title,
	.entry-content h2, .entry-content h3, .rinka-patreon-cta__title, .rinka-play-links__title) {
	text-wrap: balance;
}
body.rw26 :is(.entry-content p, .rinka-fs-head__lead, .rinka-fs-navgroup__desc, .rinka-fs-nav__sub, .rinka-play-links__hint) {
	text-wrap: pretty;
}
body.rw26 .entry-content { line-height: 1.95; }
body.rw26 .entry-title { letter-spacing: .02em; line-height: 1.45; }
/* ページ見出し：絵文字やアイコンが入るので文字グラデにはせず、やわらかい影で立体感だけ */
body.rw26 .rinka-fs-head__title {
	color: #5a3448;
	text-shadow: 0 2px 0 #fff, 0 6px 18px rgba(224, 88, 143, .22);
}
/* 小見出し（英字のキッカー）はぷっくりピルに */
body.rw26 .rinka-section__eyebrow.rinka-kicker,
body.rw26 .rinka-fs-head .rinka-section__eyebrow {
	display: inline-block;
	padding: .28em .9em .24em;
	border-radius: 999px;
	background: linear-gradient(120deg, rgba(255, 143, 191, .16), rgba(185, 163, 255, .16));
	color: var(--rw26-rose-ink);
	box-shadow: inset 0 0 0 1px rgba(224, 88, 143, .18);
}
/* セクション見出しの下線はゆっくり色がめぐる（トップは日替わりアクセントを優先してそのまま） */
body.rw26:not(.rw26-page-front) .rinka-section__title::after {
	background: linear-gradient(90deg, #ff8fbf, #c9a2ff 30%, #8fd6ff 55%, transparent 80%);
	background-size: 160% 100%;
	animation: rw26-underline 6s ease-in-out infinite alternate;
}
@keyframes rw26-underline { from { background-position: 0 0; } to { background-position: 60% 0; } }

/* ランキングの長いタイトル（英字まじり）がスマホで横にはみ出していたのを折り返す（以前からの8pxはみ出し） */
body.rw26 .rinka-fs-ranking__row-title { min-width: 0; overflow-wrap: anywhere; }

/* ---------- 6. スクロールでふわっと出る（scroll-driven animations） ---------- */
/* 透明度だけで出す＝transform を使わない（中に position:fixed の部品があっても壊さないため） */
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		body.rw26:not(.rw26-calm) :is(.rinka-section, .rinka-more, .rinka-patreon-cta, .rinka-play-links, .rinka-play-nav,
			.rinka-seo-links, .rinka-seo-ai, .rinka-fs-navgroup, #sidebar .widget, .rinka-fs-next) {
			animation: rw26-fadein linear both;
			animation-timeline: view();
			animation-range: entry 0% entry 220px;
		}
		/* 見出しとカードは少しだけ浮き上がる（中に固定配置の部品が無い葉っぱ要素だけ） */
		body.rw26:not(.rw26-calm) :is(.rinka-section__title, .rinka-fs-navgroup__title, .rinka-play-links__title, .rinka-patreon-cta__title) {
			animation: rw26-rise linear both;
			animation-timeline: view();
			animation-range: entry 0% entry 140px;
		}
		body.rw26:not(.rw26-calm) :is(.rinka-fs-nav__card, .rinka-play-links__card, .rinka-fs-card:not(.rinka-fs-pop-once)) {
			animation: rw26-pop-in linear both;
			animation-timeline: view();
			animation-range: entry 0% entry 120px;
		}
	}
}
@keyframes rw26-fadein { from { opacity: 0; } to { opacity: 1; } }
@keyframes rw26-rise { from { opacity: 0; translate: 0 18px; } to { opacity: 1; translate: 0 0; } }
@keyframes rw26-pop-in { from { opacity: 0; scale: .9; translate: 0 14px; } to { opacity: 1; scale: 1; translate: 0 0; } }

/* 記事を読み進めるバー（ページ上端・細いグラデ） */
.rw26-progress { display: none; }
@supports (animation-timeline: scroll()) {
	body.rw26 .rw26-progress {
		display: block;
		position: fixed;
		top: 0; left: 0; right: 0;
		height: 3px;
		z-index: 9985;
		pointer-events: none;
		background: var(--rw26-grad);
		transform-origin: 0 50%;
		transform: scaleX(0);
		animation: rw26-progress linear both;
		animation-timeline: scroll(root block);
		border-radius: 0 3px 3px 0;
		box-shadow: 0 0 10px rgba(255, 143, 191, .6);
	}
	body.rw26.admin-bar .rw26-progress { top: 32px; }
	@media (max-width: 782px) { body.rw26.admin-bar .rw26-progress { top: 46px; } }
}
@keyframes rw26-progress { to { transform: scaleX(1); } }

/* ---------- 7. 押したときの「ぷにっ」（うさぎっぽい弾み） ---------- */
/* scale（個別プロパティ）だけを弾ませる＝既存の transform の浮き上がりとけんかしない。
   transition は既存のもの（transform / box-shadow / border-color 等）も含めて並べ直している。 */
body.rw26:not(.rw26-calm) :is(.rinka-button, .rinka-fs-nav__card, .rinka-play-links__card, .rinka-fs-card, .rinka-home-task,
	.rinka-bottom-nav__item, .rinka-thumb-nav__btn, .rinka-nav-sheet__item, .rinka-nav-sheet__hero-item,
	.rinka-nav-sheet__chip, .rinka-play-nav__link, .rw26-mission, .rw26-chip) {
	transition:
		scale .5s var(--rw26-spring),
		transform .25s ease,
		box-shadow .25s ease,
		border-color .2s ease,
		background-color .2s ease,
		color .2s ease,
		filter .15s ease;
	-webkit-tap-highlight-color: transparent;
}
body.rw26:not(.rw26-calm) :is(.rinka-button, .rinka-fs-nav__card, .rinka-play-links__card, .rinka-fs-card, .rinka-home-task,
	.rinka-bottom-nav__item, .rinka-thumb-nav__btn, .rinka-nav-sheet__item, .rinka-nav-sheet__hero-item,
	.rinka-nav-sheet__chip, .rinka-play-nav__link, .rw26-mission, .rw26-chip):active {
	scale: .93;
	transition-duration: .08s;
}
@media (hover: hover) {
	body.rw26:not(.rw26-calm) :is(.rinka-fs-nav__card, .rinka-play-links__card, .rinka-fs-card, .rinka-play-nav__link):hover {
		scale: 1.025;
		box-shadow: var(--rw26-shadow-lg);
	}
}
/* キーボード操作の見えるフォーカス（詳細度0の保険＝既存の指定が勝つ） */
:where(body.rw26) :where(a, button, summary, [tabindex]):focus-visible {
	outline: 3px solid rgba(224, 88, 143, .55);
	outline-offset: 2px;
	border-radius: 10px;
}

/* ---------- 8. カード一覧：置き場所の広さに合わせて並びを変える（container queries） ---------- */
@supports (container-type: inline-size) {
	body.rw26 :is(.rinka-fs-navgroup, .rinka-play-links, .rinka-section:has(> .rinka-fs-nav)) {
		container: rw26-cards / inline-size;
	}
	@container rw26-cards (max-width: 440px) {
		body.rw26 .rinka-fs-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
		body.rw26 .rinka-play-links__grid { grid-template-columns: 1fr; }
	}
	@container rw26-cards (min-width: 900px) {
		body.rw26 .rinka-fs-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
		body.rw26 .rinka-play-links__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	}
}
body.rw26 .rinka-fs-nav__card {
	border-radius: var(--rw26-radius);
	border-color: var(--rw26-card-line);
	box-shadow: var(--rw26-shadow-sm);
	background:
		radial-gradient(120% 80% at 50% 0%, rgba(255, 143, 191, .08), transparent 60%),
		var(--rw26-card);
}
body.rw26 .rinka-fs-nav__emoji { transition: scale .5s var(--rw26-spring), rotate .5s var(--rw26-spring); }
@media (hover: hover) {
	body.rw26 .rinka-fs-nav__card:hover .rinka-fs-nav__emoji { scale: 1.18; rotate: -8deg; }
}
body.rw26 .rinka-play-links__card { border-radius: 16px; }
/* :has() — いま開いているページのカードをそっと光らせる（aria-current を持つもの） */
body.rw26 .rinka-fs-nav__card:has([aria-current]),
body.rw26 .rinka-fs-nav__card[aria-current] {
	box-shadow: 0 0 0 2px var(--rw26-pink), var(--rw26-shadow);
}

/* ---------- 9. スマホ下部ナビ（既存 #rinka-bottom-nav）をぷっくり＆光るものに ---------- */
body.rw26 .rinka-bottom-nav {
	--rw26-xp: 0;
	border-top-color: rgba(244, 217, 230, .9);
	border-radius: 22px 22px 0 0;
	box-shadow: 0 -10px 30px -10px rgba(184, 58, 114, .28);
}
/* 上ふちの経験値バー（ワールドレベルの進み具合） */
body.rw26 .rinka-bottom-nav::before {
	content: '';
	position: absolute;
	left: 18px; right: 18px; top: 0;
	height: 3px;
	border-radius: 0 0 3px 3px;
	background: linear-gradient(90deg, #ff8fbf, #c9a2ff, #8fd6ff);
	transform-origin: 0 50%;
	transform: scaleX(var(--rw26-xp));
	transition: transform 1.2s var(--rw26-ease);
	opacity: .9;
}
body.rw26 .rinka-bottom-nav__item { color: var(--rw26-ink-soft); font-size: .66rem; }
body.rw26 .rinka-bottom-nav__ico {
	display: inline-grid;
	place-items: center;
	width: 34px; height: 28px;
	border-radius: 999px;
	transition: background-color .3s ease, scale .5s var(--rw26-spring), translate .5s var(--rw26-spring);
}
body.rw26 .rinka-bottom-nav__item.is-now { color: var(--rw26-rose-ink); }
body.rw26 .rinka-bottom-nav__item.is-now::before { display: none; }
body.rw26 .rinka-bottom-nav__item.is-now .rinka-bottom-nav__ico {
	background: linear-gradient(135deg, rgba(255, 143, 191, .32), rgba(201, 162, 255, .32));
	translate: 0 -2px;
	scale: 1.08;
}
body.rw26 .rinka-bottom-nav__badge { box-shadow: 0 0 0 0 rgba(240, 163, 94, .6); animation: rw26-ping 2.4s ease-out infinite; }
@keyframes rw26-ping {
	0% { box-shadow: 0 0 0 0 rgba(240, 163, 94, .55); }
	70%, 100% { box-shadow: 0 0 0 7px rgba(240, 163, 94, 0); }
}
/* メニューに付く「Lv」バッジ */
.rw26-navlv {
	position: absolute;
	top: 3px; left: calc(50% + 6px);
	min-width: 26px;
	padding: 1px 5px;
	border-radius: 999px;
	background: linear-gradient(120deg, #ff8fbf, #b98cff);
	color: #fff;
	font: 800 .56rem/1.3 var(--rinka-font-latin, 'Quicksand', sans-serif);
	letter-spacing: .02em;
	text-align: center;
	box-shadow: 0 2px 6px rgba(184, 58, 114, .35);
	pointer-events: none;
}
.rw26-navlv.is-up { animation: rw26-bounce .9s var(--rw26-spring) 2; }

/* 下部ナビが出ている時は、ほかの浮いている部品をナビの上へ逃がす（重なり防止）。
   rw26-dock は PHP が最初から付ける＝JS を待たずに位置が決まる（あとからずれない）。 */
@media (max-width: 782px) {
	body.rw26-dock .rinka-bottom-nav { display: flex; }
	body.rw26-dock { padding-bottom: calc(64px + var(--rw26-safe-b)); }
	body.rw26-dock .mobile-menu-buttons { display: none !important; }
	body.rw26-dock .rinka-mascot,
	body.rw26-dock .rinka-totop {
		bottom: calc(var(--rw26-nav-h) + 12px + var(--rw26-safe-b));
	}
	body.rw26-dock .rinka-fs-toasts { bottom: calc(var(--rw26-nav-h) + 22px + var(--rw26-safe-b)); }
	body.rw26-dock .rinka-fs-xwidget-open { bottom: calc(var(--rw26-nav-h) + 96px + var(--rw26-safe-b)); }
	body.rw26-dock .rinka-thumb-nav {
		bottom: calc(var(--rw26-nav-h) + 10px + var(--rw26-safe-b));
		/* 右下のマスコットと重ならないよう左寄せ＆少しコンパクトに */
		left: 12px;
		right: auto;
		transform: none;
		max-width: calc(100vw - 100px);
		gap: 2px;
		padding: 4px;
	}
	body.rw26-dock .rinka-thumb-nav__btn { padding: 6px 10px; font-size: 12px; }
	body.rw26-dock .rinka-homepage { padding-bottom: calc(80px + var(--rw26-safe-b)); }
}
/* トップ（親指ナビがある画面幅）では「UP」ボタンを親指ナビの上の段へ */
@media (max-width: 640px) {
	body.rw26-dock.rw26-page-front .rinka-totop { bottom: calc(var(--rw26-nav-h) + 72px + var(--rw26-safe-b)); }
}
/* トップの親指ナビ（ページ内ジャンプ）もガラスのピルに */
body.rw26 .rinka-thumb-nav {
	background: rgba(255, 255, 255, .78);
	border-color: rgba(224, 88, 143, .22);
	box-shadow: 0 10px 28px -8px rgba(184, 58, 114, .35);
}
body.rw26 .rinka-thumb-nav__btn { color: var(--rw26-ink); }

/* メニューシート（既存）もすこし上品に */
body.rw26 .rinka-nav-sheet__panel {
	border-radius: 26px 26px 0 0;
	background:
		radial-gradient(120% 40% at 50% 0%, rgba(255, 143, 191, .14), transparent 70%),
		var(--rinka-surface, #fffdfd);
}
body.rw26 .rinka-nav-sheet__item { border-radius: 16px; }
/* :has() — メニューがひらいている間は、右下のマスコットをそっと引っこめる（リンクに重ならないように） */
body.rw26:has(.rinka-nav-sheet.is-open) .rinka-mascot,
body.rw26:has(.rw26-pop:not([hidden])) .rinka-mascot {
	opacity: 0;
	pointer-events: none;
	transition: opacity .2s ease;
}

/* ---------- 10. いまどこ（パンくず）— 見出しの上に場所を用意しておく＝ずれ(CLS)なし ---------- */
body.rw26.rw26-has-crumb .rinka-fs-head { position: relative; padding-top: 70px; }
.rw26-crumb {
	position: absolute;
	top: 14px; left: 50%;
	translate: -50% 0;
	display: flex;
	align-items: center;
	gap: 4px;
	max-width: calc(100% - 24px);
	margin: 0;
	min-height: 44px;
	padding: 0 12px 0 4px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .8);
	box-shadow: inset 0 0 0 1px rgba(224, 88, 143, .16), var(--rw26-shadow-sm);
	font-size: .74rem;
	line-height: 1.3;
	color: var(--rw26-ink-soft);
	white-space: nowrap;
	overflow: hidden;
	text-align: left;
}
.rw26-crumb a {
	color: var(--rw26-rose-ink);
	text-decoration: none;
	font-weight: 700;
	flex: none;
	/* 押せる高さ 44px 以上（2026-09-26） */
	display: inline-flex;
	align-items: center;
	gap: 4px;
	min-height: 44px;
	padding: 0 8px;
	border-radius: 999px;
}
.rw26-crumb a:active { background: rgba(224, 88, 143, .1); }
.rw26-crumb a:hover { text-decoration: underline; }
.rw26-crumb__sep { opacity: .5; flex: none; }
.rw26-crumb__now { font-weight: 800; color: var(--rw26-ink); overflow: hidden; text-overflow: ellipsis; }
.rw26-crumb__grp { display: contents; }
@media (max-width: 420px) {
	.rw26-crumb__grp { display: none; }
}
.rw26-crumb__here {
	flex: none;
	margin-left: 4px;
	padding: 1px 7px;
	border-radius: 999px;
	background: var(--rw26-rose);
	color: #fff;
	font-size: .62rem;
	font-weight: 800;
}

/* ---------- 11. ワールドパスポート（レベル・経験値・きょうのミッション） ---------- */
.rw26-pass {
	--rw26-xp: 0;
	position: relative;
	margin: 6px 0 12px;
	padding: 14px 14px 12px;
	border-radius: 22px;
	color: var(--rw26-ink, #4a3540);
	background:
		radial-gradient(90% 70% at 100% 0%, rgba(201, 162, 255, .22), transparent 60%),
		radial-gradient(80% 70% at 0% 100%, rgba(255, 143, 191, .2), transparent 60%),
		#fff;
	box-shadow: inset 0 0 0 1px rgba(224, 88, 143, .18), 0 8px 24px -12px rgba(184, 58, 114, .35);
	overflow: hidden;
	text-align: left;
}
.rw26-pass__top { display: flex; align-items: center; gap: 12px; }
.rw26-pass__ring {
	--p: calc(var(--rw26-xp) * 100%);
	flex: none;
	position: relative;
	display: grid;
	place-items: center;
	width: 62px; height: 62px;
	border-radius: 50%;
	background: conic-gradient(#ff8fbf 0, #c9a2ff var(--p), rgba(224, 88, 143, .12) var(--p));
	transition: --rw26-xp 1.4s var(--rw26-ease);
}
.rw26-pass__ring::before {
	content: '';
	position: absolute;
	inset: 6px;
	border-radius: 50%;
	background: #fff;
}
.rw26-pass__lv {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1;
	font-family: var(--rinka-font-latin, 'Quicksand', sans-serif);
}
.rw26-pass__lv small { font-size: .56rem; font-weight: 700; letter-spacing: .12em; color: var(--rw26-ink-soft, #76606c); }
.rw26-pass__lv b { font-size: 1.35rem; font-weight: 800; color: var(--rw26-rose-ink, #b83a72); }
.rw26-pass__who { min-width: 0; flex: 1; }
.rw26-pass__title { margin: 0; font-size: .95rem; font-weight: 900; line-height: 1.35; }
.rw26-pass__sub { margin: 2px 0 6px; font-size: .72rem; color: var(--rw26-ink-soft, #76606c); line-height: 1.4; }
.rw26-pass__bar {
	position: relative;
	height: 9px;
	border-radius: 999px;
	background: rgba(224, 88, 143, .12);
	overflow: hidden;
}
.rw26-pass__bar i {
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(90deg, #ff8fbf, #c9a2ff, #8fd6ff);
	transform-origin: 0 50%;
	transform: scaleX(var(--rw26-xp));
	transition: transform 1.3s var(--rw26-ease);
}
.rw26-pass__bar i::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .7) 50%, transparent 70%);
	background-size: 220% 100%;
	animation: rw26-shimmer 2.8s ease-in-out infinite;
}
@keyframes rw26-shimmer { from { background-position: 120% 0; } to { background-position: -120% 0; } }
.rw26-pass__xp { margin: 4px 0 0; font-size: .66rem; color: var(--rw26-ink-soft, #76606c); font-variant-numeric: tabular-nums; }
.rw26-pass__stats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 6px;
	margin: 12px 0 10px;
	padding: 0;
	list-style: none;
}
.rw26-pass__stats li {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1px;
	padding: 6px 2px;
	border-radius: 12px;
	background: rgba(255, 255, 255, .75);
	box-shadow: inset 0 0 0 1px rgba(224, 88, 143, .1);
	font-size: .6rem;
	color: var(--rw26-ink-soft, #76606c);
	text-align: center;
	line-height: 1.25;
}
.rw26-pass__stats b { font-size: .92rem; color: var(--rw26-ink, #4a3540); font-variant-numeric: tabular-nums; }
.rw26-pass__h {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 4px 0 6px;
	font-size: .8rem;
	font-weight: 900;
}
.rw26-pass__h span:last-child { font-size: .7rem; font-weight: 700; color: var(--rw26-rose-ink, #b83a72); font-variant-numeric: tabular-nums; }
.rw26-missions { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.rw26-mission {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	padding: 7px 10px;
	border-radius: 14px;
	background: #fff;
	box-shadow: inset 0 0 0 1px rgba(224, 88, 143, .14);
	color: var(--rw26-ink, #4a3540);
	text-decoration: none;
	font-size: .8rem;
	font-weight: 700;
}
a.rw26-mission:hover { box-shadow: inset 0 0 0 1.5px rgba(224, 88, 143, .45); }
.rw26-mission__check {
	flex: none;
	display: grid;
	place-items: center;
	width: 24px; height: 24px;
	border-radius: 50%;
	background: rgba(224, 88, 143, .1);
	font-size: .8rem;
	color: transparent;
	transition: background-color .3s ease, scale .6s var(--rw26-spring);
}
.rw26-mission.is-done .rw26-mission__check { background: linear-gradient(135deg, #7fd8b9, #5cc0a0); color: #fff; }
.rw26-mission.is-new .rw26-mission__check { animation: rw26-bounce .9s var(--rw26-spring); }
.rw26-mission__ico { flex: none; font-size: 1.05rem; line-height: 1; }
.rw26-mission__txt { flex: 1; min-width: 0; line-height: 1.35; }
.rw26-mission__txt small { display: block; font-size: .64rem; font-weight: 500; color: var(--rw26-ink-soft, #76606c); }
.rw26-mission__xp { flex: none; font: 800 .64rem/1 var(--rinka-font-latin, 'Quicksand', sans-serif); color: var(--rw26-rose-ink, #b83a72); }
.rw26-mission.is-done { background: rgba(236, 250, 245, .9); }
.rw26-mission.is-done .rw26-mission__txt { color: #3f6f60; }
.rw26-stamps { display: flex; justify-content: space-between; gap: 4px; margin: 10px 0 2px; padding: 0; list-style: none; }
.rw26-stamps li {
	flex: 1;
	display: grid;
	place-items: center;
	aspect-ratio: 1;
	max-width: 36px;
	border-radius: 50%;
	border: 1.5px dashed rgba(224, 88, 143, .3);
	font-size: .8rem;
	color: rgba(118, 96, 108, .7);
}
.rw26-stamps li.is-on {
	border: none;
	background: radial-gradient(circle at 35% 30%, #ffd1e6, #ff8fbf);
	color: #fff;
	box-shadow: 0 3px 8px rgba(224, 88, 143, .35);
	rotate: -8deg;
}
.rw26-stamps li.is-today { outline: 2px solid rgba(201, 162, 255, .7); outline-offset: 2px; }
.rw26-pass__foot { margin: 6px 0 0; font-size: .66rem; color: var(--rw26-ink-soft, #76606c); text-align: center; }
.rw26-pass__links { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; }
.rw26-pass__links a {
	flex: 1 1 auto;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	gap: 4px;
	min-height: 40px;
	padding: 6px 10px;
	border-radius: 999px;
	background: rgba(255, 143, 191, .12);
	color: var(--rw26-rose-ink, #b83a72);
	font-size: .74rem;
	font-weight: 800;
	text-decoration: none;
}

/* PC（下部ナビが無い画面）：左下の小さなチップ → ひらくとパスポート */
.rw26-chip {
	position: fixed;
	left: 16px;
	bottom: 84px;
	z-index: 9100;
	display: none;
	align-items: center;
	gap: 8px;
	padding: 6px 14px 6px 6px;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, .86);
	box-shadow: inset 0 0 0 1px rgba(224, 88, 143, .2), 0 10px 26px -10px rgba(184, 58, 114, .45);
	color: var(--rw26-ink, #4a3540);
	font: 800 .78rem/1.2 var(--rinka-font, sans-serif);
	cursor: pointer;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}
.rw26-chip__ring {
	--p: calc(var(--rw26-xp) * 100%);
	display: grid;
	place-items: center;
	width: 38px; height: 38px;
	border-radius: 50%;
	background: conic-gradient(#ff8fbf 0, #c9a2ff var(--p), rgba(224, 88, 143, .14) var(--p));
	position: relative;
}
.rw26-chip__ring::before { content: ''; position: absolute; inset: 4px; border-radius: 50%; background: #fff; }
.rw26-chip__ring b { position: relative; font: 800 .74rem/1 var(--rinka-font-latin, 'Quicksand', sans-serif); color: var(--rw26-rose-ink, #b83a72); }
.rw26-chip__txt { display: flex; flex-direction: column; text-align: left; }
.rw26-chip__txt small { font-size: .62rem; font-weight: 700; color: var(--rw26-ink-soft, #76606c); }
.rw26-chip.is-up { animation: rw26-bounce .9s var(--rw26-spring) 2; }
@media (min-width: 783px) {
	body.rw26 .rw26-chip { display: inline-flex; }
	/* 本文の横のすき間に収まるよう、ふだんは輪っかだけ。さわる／フォーカスで文字がのびる */
	body.rw26 .rw26-chip { left: 8px; padding: 5px; gap: 0; }
	body.rw26 .rw26-chip .rw26-chip__txt {
		max-width: 0;
		overflow: hidden;
		white-space: nowrap;
		opacity: 0;
		transition: max-width .45s var(--rw26-ease), opacity .3s ease, margin .45s var(--rw26-ease);
	}
	body.rw26 .rw26-chip:is(:hover, :focus-visible, [aria-expanded="true"]) { padding-right: 14px; }
	body.rw26 .rw26-chip:is(:hover, :focus-visible, [aria-expanded="true"]) .rw26-chip__txt { max-width: 140px; opacity: 1; margin-left: 8px; }
	.rw26-pop { left: 8px; }
}
@media (min-width: 1560px) {
	body.rw26 .rw26-chip { padding-right: 14px; }
	body.rw26 .rw26-chip .rw26-chip__txt { max-width: 140px; opacity: 1; margin-left: 8px; }
}
/* 下部ナビが使えない（=JS後もクラスが付かない）スマホでもチップを出す保険 */
@media (max-width: 782px) {
	body.rw26:not(.rw26-dock) .rw26-chip { display: inline-flex; bottom: calc(80px + var(--rw26-safe-b)); }
}
.rw26-pop {
	position: fixed;
	left: 16px;
	bottom: 136px;
	z-index: 9990;
	width: min(360px, calc(100vw - 32px));
	max-height: min(76vh, 640px);
	overflow-y: auto;
	margin: 0;
	padding: 6px;
	border: 0;
	border-radius: 26px;
	background: rgba(255, 253, 254, .96);
	box-shadow: 0 30px 70px -20px rgba(110, 40, 90, .45), inset 0 0 0 1px rgba(224, 88, 143, .16);
	opacity: 1;
	translate: 0 0;
	scale: 1;
	transform-origin: 0 100%;
	transition: opacity .25s ease, translate .45s var(--rw26-spring), scale .45s var(--rw26-spring), display .25s allow-discrete;
}
.rw26-pop[hidden] { display: none; opacity: 0; translate: 0 12px; scale: .92; }
@starting-style {
	.rw26-pop:not([hidden]) { opacity: 0; translate: 0 12px; scale: .92; }
}
@media (max-width: 782px) {
	.rw26-pop { left: 12px; right: 12px; width: auto; bottom: calc(132px + var(--rw26-safe-b)); }
}
.rw26-pop__close {
	position: absolute;
	top: 12px; right: 12px;
	z-index: 1;
	width: 36px; height: 36px;
	border: 0;
	border-radius: 50%;
	background: rgba(224, 88, 143, .1);
	color: var(--rw26-ink, #4a3540);
	font-size: .9rem;
	cursor: pointer;
}
.rw26-pop .rw26-pass { margin: 0; }
.rw26-pop .rw26-pass__top { padding-right: 36px; }

/* 小さなお祝いトースト＋紙ふぶき */
.rw26-toast {
	position: fixed;
	text-align: center;
	line-height: 1.45;
	left: 50%;
	top: calc(14px + env(safe-area-inset-top, 0px));
	z-index: 99990;
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: calc(100vw - 24px);
	width: max-content;
	padding: 9px 18px;
	border-radius: 24px;
	background: linear-gradient(120deg, #ff8fbf, #b98cff);
	color: #fff;
	font-size: .84rem;
	font-weight: 800;
	box-shadow: 0 14px 30px -10px rgba(184, 58, 114, .55);
	pointer-events: none;
	translate: -50% 0;
	opacity: 1;
	transition: opacity .3s ease, translate .5s var(--rw26-spring);
}
@starting-style {
	.rw26-toast { opacity: 0; translate: -50% -16px; }
}
.rw26-toast.is-out { opacity: 0; translate: -50% -12px; }
.rw26-confetti { position: fixed; inset: 0; z-index: 99989; pointer-events: none; overflow: hidden; }
.rw26-confetti i {
	position: absolute;
	top: -12px;
	width: 8px; height: 12px;
	border-radius: 3px;
	opacity: .95;
	animation: rw26-fall var(--d, 1.6s) cubic-bezier(.25, .6, .35, 1) forwards;
}
@keyframes rw26-fall {
	to { transform: translate3d(var(--x, 0), 105vh, 0) rotate(var(--r, 540deg)); opacity: .7; }
}
@keyframes rw26-bounce {
	0% { scale: 1; }
	30% { scale: 1.28; }
	55% { scale: .92; }
	80% { scale: 1.06; }
	100% { scale: 1; }
}

/* ---------- 12. ダークモード（自分で足した部品だけ。サイト本体は今のまま） ---------- */
@media (prefers-color-scheme: dark) {
	.rw26-pass {
		color: #f3e6ee;
		background:
			radial-gradient(90% 70% at 100% 0%, rgba(160, 120, 255, .22), transparent 60%),
			radial-gradient(80% 70% at 0% 100%, rgba(255, 110, 170, .18), transparent 60%),
			#2a2230;
		box-shadow: inset 0 0 0 1px rgba(255, 143, 191, .22);
		--rw26-ink: #f3e6ee;
		--rw26-ink-soft: #c9b4c1;
		--rw26-rose-ink: #ff9fc8;
	}
	.rw26-pass__ring::before, .rw26-chip__ring::before { background: #2a2230; }
	.rw26-pass__stats li { background: rgba(255, 255, 255, .06); }
	.rw26-mission { background: rgba(255, 255, 255, .05); color: #f3e6ee; }
	.rw26-mission.is-done { background: rgba(92, 192, 160, .16); }
	.rw26-mission.is-done .rw26-mission__txt { color: #a8ead3; }
	.rw26-pop { background: rgba(34, 27, 40, .97); }
	.rw26-chip { background: rgba(34, 27, 40, .88); color: #f3e6ee; --rw26-ink-soft: #c9b4c1; --rw26-rose-ink: #ff9fc8; }
	.rw26-crumb { background: rgba(34, 27, 40, .8); color: #c9b4c1; }
	.rw26-crumb__now { color: #f3e6ee; }
	.rw26-crumb a { color: #ff9fc8; }
}

/* ---------- 13. 動きを減らす設定では全部止める ---------- */
@media (prefers-reduced-motion: reduce) {
	body.rw26::before,
	body.rw26::after,
	body.rw26 #header-container::after,
	body.rw26 .rinka-section__title::after,
	body.rw26 .rinka-bottom-nav__badge,
	.rw26-pass__bar i::after,
	.rw26-navlv.is-up,
	.rw26-chip.is-up,
	.rw26-mission.is-new .rw26-mission__check {
		animation: none !important;
	}
	body.rw26 :is(.rinka-section, .rinka-more, .rinka-patreon-cta, .rinka-play-links, .rinka-play-nav, .rinka-seo-links,
		.rinka-seo-ai, .rinka-fs-navgroup, #sidebar .widget, .rinka-fs-next, .rinka-section__title, .rinka-fs-navgroup__title,
		.rinka-play-links__title, .rinka-patreon-cta__title, .rinka-fs-nav__card, .rinka-play-links__card, .rinka-fs-card) {
		animation: none !important;
		opacity: 1 !important;
		translate: none !important;
		scale: none !important;
	}
	body.rw26 * { transition-duration: .01ms !important; }
	.rw26-confetti { display: none !important; }
	.rw26-progress { display: none !important; }
	::view-transition-old(root), ::view-transition-new(root) { animation: none !important; }
}

/* ---------- UIアイコン（絵文字のかわりの共通SVG・2026-09-26） ---------- */
.rw26-ico { display: inline-flex; align-items: center; justify-content: center; line-height: 0; vertical-align: -.15em; }
.rw26-ico svg { width: 1em; height: 1em; }
.rw26-pass__h .rw26-ico { margin-right: 6px; color: var(--rw26-rose-ink); }
.rw26-mission__ico .rw26-ico svg { width: 18px; height: 18px; }
.rw26-stamps li.is-on .rw26-ico svg { width: 16px; height: 16px; }
.rw26-pass__links .rw26-ico { margin-right: 4px; }
body.rw26 .rinka-bottom-nav__ico svg { width: 22px; height: 22px; }