html {
	scroll-behavior: smooth;
	background: var(--rx3-bg);
}

body.review-v3 {
	margin: 0;
	background: var(--rx3-bg);
	color: var(--rx3-text);
	font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

body.review-v3 *,
body.review-v3 *::before,
body.review-v3 *::after {
	box-sizing: border-box;
}

body.review-v3 img {
	max-width: 100%;
}

body.review-v3 a {
	color: inherit;
}

body.review-v3 button,
body.review-v3 input,
body.review-v3 select,
body.review-v3 textarea {
	font: inherit;
}

body.review-v3::before {
	content: "";
	position: fixed;
	z-index: 99999;
	top: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background: linear-gradient(90deg, var(--rx3-accent), #ff9470, var(--rx3-gold));
	box-shadow: 0 0 18px rgba(237,91,145,.55);
	transform: scaleX(var(--rx3-progress, 0));
	transform-origin: left center;
	pointer-events: none;
}

/* Native cross-document transitions are an enhancement only. Navigation is
 * never intercepted or delayed when the browser does not support them. */
@keyframes rx3-page-exit {
	to {
		opacity: .96;
		transform: translate3d(0, -4px, 0);
	}
}

@keyframes rx3-page-enter {
	from {
		opacity: .96;
		transform: translate3d(0, 6px, 0);
	}
}

@media (prefers-reduced-motion: no-preference) {
	@view-transition {
		navigation: auto;
	}

	::view-transition-old(root) {
		animation: rx3-page-exit var(--rx3-motion-fast) var(--rx3-ease-in) both;
	}

	::view-transition-new(root) {
		animation: rx3-page-enter var(--rx3-motion-base) var(--rx3-ease-out) both;
	}
}

.review-v3 .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.review-v3 .skip-link:focus {
	position: fixed !important;
	z-index: 100000;
	top: .75rem;
	left: .75rem;
	width: auto;
	height: auto;
	padding: .75rem 1rem;
	clip: auto;
	background: var(--rx3-paper);
	color: var(--rx3-ink);
}

/* --------------------------------------------------------------------------
 * Header
 * ----------------------------------------------------------------------- */
.review-v3 .site-header.rx3-site-header {
	position: fixed;
	z-index: 2000;
	top: 0;
	left: 0;
	right: 0;
	margin: 0;
	border: 0;
	background: linear-gradient(180deg, rgba(7,7,9,.88), rgba(7,7,9,.42) 68%, transparent);
	backdrop-filter: none;
	transition: background-color .28s ease, border-color .28s ease, backdrop-filter .28s ease;
}

.review-v3 .site-header.rx3-site-header.is-scrolled {
	border-bottom: 1px solid var(--rx3-line);
	background: rgba(9,9,11,.9);
	backdrop-filter: blur(18px) saturate(130%);
	box-shadow: 0 14px 34px rgba(0,0,0,.2);
}

.review-v3 .rx3-site-header__inner {
	display: grid;
	grid-template-columns: minmax(180px, .7fr) minmax(0, 1.6fr) auto;
	align-items: center;
	gap: clamp(1rem, 3vw, 3rem);
	width: min(calc(100% - 3rem), var(--rx3-max));
	min-height: 84px;
	margin-inline: auto;
}

.review-v3 .rx3-brand {
	display: flex;
	align-items: center;
	gap: .9rem;
	min-width: 0;
}

.review-v3 .rx3-brand .custom-logo-link {
	display: inline-flex;
}

.review-v3 .rx3-brand .custom-logo {
	display: block;
	width: auto;
	max-width: min(240px, 32vw);
	max-height: 44px;
}

.review-v3 .rx3-brand__fallback {
	margin: 0;
	font-family: Georgia, "Yu Mincho", serif;
	font-size: clamp(1.2rem, 2vw, 1.7rem);
	font-weight: 600;
	letter-spacing: -.04em;
}

.review-v3 .rx3-brand__fallback a {
	text-decoration: none;
}

.review-v3 .rx3-brand__edition {
	padding-left: .85rem;
	border-left: 1px solid var(--rx3-line);
	color: var(--rx3-text-dim);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: .62rem;
	font-weight: 750;
	letter-spacing: .16em;
	line-height: 1.45;
	text-transform: uppercase;
	white-space: nowrap;
}

.review-v3 .primary-navigation.rx3-nav {
	position: static;
	padding: 0;
	background: transparent;
	box-shadow: none;
}

.review-v3 .rx3-nav .menu,
.review-v3 .rx3-nav > ul {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(.8rem, 2.2vw, 2.1rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

.review-v3 .rx3-nav li {
	margin: 0;
}

.review-v3 .rx3-nav a {
	position: relative;
	display: inline-flex;
	padding-block: .55rem;
	color: rgba(255,255,255,.72);
	font-size: .72rem;
	font-weight: 750;
	letter-spacing: .08em;
	text-decoration: none;
	white-space: nowrap;
	transition: color .2s ease;
}

.review-v3 .rx3-nav a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 100%;
	bottom: .22rem;
	height: 1px;
	background: var(--rx3-accent);
	transition: right .22s ease;
}

.review-v3 .rx3-nav a:hover,
.review-v3 .rx3-nav a:focus-visible {
	color: #fff;
}

.review-v3 .rx3-nav a:hover::after,
.review-v3 .rx3-nav a:focus-visible::after {
	right: 0;
}

@media (min-width: 1101px) {
	body.review-v3 .rx3-site-header__inner {
		grid-template-columns: minmax(180px, .45fr) minmax(0, 1.85fr) auto;
		gap: clamp(.75rem, 1.5vw, 1.5rem);
	}

	body.review-v3 .rx3-nav .menu,
	body.review-v3 .rx3-nav > ul {
		flex-wrap: nowrap;
		gap: clamp(.5rem, 1vw, 1.2rem);
	}
}

.review-v3 .rx3-header__aside {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: .75rem;
}

.review-v3 .rx3-header__index {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	min-height: 40px;
	padding: .65rem .95rem;
	border: 1px solid rgba(255,255,255,.18);
	border-radius: 999px;
	color: #fff;
	font-size: .67rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-decoration: none;
	text-transform: uppercase;
	transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}

.review-v3 .rx3-header__index:hover {
	border-color: rgba(237,91,145,.75);
	background: rgba(237,91,145,.12);
	transform: translateY(-1px);
}

.review-v3 .menu-toggle.rx3-menu-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--rx3-line);
	border-radius: 50%;
	background: rgba(255,255,255,.04);
	color: #fff;
}

.review-v3 .rx3-menu-toggle .menu-toggle__label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
}

.review-v3 .rx3-menu-toggle .menu-toggle__icon {
	display: grid;
	gap: 4px;
	width: 18px;
}

.review-v3 .rx3-menu-toggle .menu-toggle__icon span {
	display: block;
	height: 1px;
	background: currentColor;
	transition: transform .2s ease, opacity .2s ease;
}
