.ny-rel {
	--ny-ink: #4a3f2f;
	--ny-brown: #6b5348;
	--ny-paper: #fffdf8;
	--ny-cream: #fff8f2;
	--ny-line: #e6d3c4;
	--ny-purple: #6a4f9a;
	--ny-purple-soft: #f5f0ff;
	--ny-lavender: rgba(177, 145, 255, .35);
	--ny-header-offset: calc(var(--nk-header-sticky-height, 80px) + 12px);
	box-sizing: border-box;
	max-width: 36rem;
	margin: 0 auto 2rem;
	padding: .35rem .75rem calc(8rem + env(safe-area-inset-bottom));
	color: var(--ny-ink);
	font-family: "Hiragino Maru Gothic ProN", "Yu Gothic", sans-serif;
	container-type: inline-size;
}
.ny-rel *,
.ny-rel *::before,
.ny-rel *::after { box-sizing: border-box; }
.ny-rel [hidden] { display: none !important; }
.ny-rel h1,
.ny-rel h2,
.ny-rel h3 { line-height: 1.35; }
.ny-rel p { line-height: 1.7; }
.ny-rel a { color: var(--ny-purple); }

.ny-rel-hero {
	position: relative;
	margin: 0 0 .75rem;
	padding: .9rem .95rem 1rem;
	border: 1px solid var(--ny-lavender);
	border-radius: 20px;
	background: linear-gradient(180deg, #f6f0ff 0%, var(--ny-cream) 72%);
}
.ny-rel-hero--image {
	padding: .4rem .4rem .85rem;
	background: #fffdf8;
}
.ny-rel-hero--image h1 {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.ny-rel-hero--image .ny-rel-hero-copy { padding: 0; }
.ny-rel-hero h1 {
	margin: 0 0 .35rem;
	color: #5f3a8d;
	font-size: clamp(1.45rem, 6.2vw, 1.9rem);
}
.ny-rel-catch {
	margin: 0 0 .3rem;
	color: var(--ny-brown);
	font-size: 1.02rem;
	font-weight: 800;
	line-height: 1.45;
	line-break: auto;
	overflow-wrap: anywhere;
	word-break: keep-all;
}
.ny-rel-hero-sub {
	margin: 0;
	font-size: .95rem;
	line-height: 1.55;
	line-break: auto;
	overflow-wrap: anywhere;
	word-break: keep-all;
}
body .wp-site-blocks .ny-rel-catch,
body .wp-site-blocks .ny-rel-hero-sub {
	line-break: auto;
	overflow-wrap: anywhere;
	word-break: keep-all;
}
.ny-rel-hero-art:empty { display: none; }
.ny-rel-hero-art img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 0 .7rem;
	aspect-ratio: 1200 / 896;
	object-fit: contain;
	border-radius: 16px;
}

.ny-rel-pair { display: grid; gap: .65rem; }
.ny-rel-person {
	min-width: 0;
	margin: 0;
	padding: .7rem .75rem .8rem;
	border: 1px solid var(--ny-line);
	border-radius: 16px;
	background: var(--ny-paper);
}
.ny-rel br { display: none; }
.ny-rel-person > p { margin: 0; }
.ny-rel-person legend {
	padding: 0;
	color: #5f3a8d;
	font-size: 1rem;
	font-weight: 800;
}
.ny-rel-label,
.ny-rel-kin label,
.ny-rel-date label {
	display: block;
	margin: .45rem 0 .2rem;
	color: var(--ny-brown);
	font-size: .86rem;
	font-weight: 800;
}
.ny-rel-optional {
	display: inline-block;
	margin-left: .35rem;
	padding: .05rem .4rem;
	border-radius: 999px;
	background: #f3e7ff;
	color: var(--ny-purple);
	font-size: .75rem;
	font-weight: 800;
}
.ny-rel input,
.ny-rel select {
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: .45rem .65rem;
	border: 1px solid #e4d3c4;
	border-radius: 12px;
	background: #fff;
	color: var(--ny-ink);
	font-size: 16px;
}
.ny-rel-tabs {
	display: flex;
	gap: .25rem;
	margin-top: .55rem;
	padding: .25rem;
	border-radius: 999px;
	background: #f3eadf;
}
.ny-rel-tabs button {
	flex: 1 1 0;
	min-height: 44px;
	padding: .35rem .4rem;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--ny-brown);
	font-weight: 800;
	font-size: .86rem;
	line-height: 1.25;
	cursor: pointer;
}
.ny-rel-tabs button[aria-selected="true"] {
	background: var(--ny-purple);
	color: #fff;
}
.ny-rel-tabs button:focus-visible {
	outline: 2px solid var(--ny-purple);
	outline-offset: 2px;
}
.ny-rel-date {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, .8fr) minmax(0, .8fr);
	gap: .4rem;
	margin-top: .45rem;
}
.ny-rel-date label {
	min-width: 0;
	margin: 0;
}
.ny-rel-date select {
	appearance: none;
	padding-right: 1.35rem;
	background-image: linear-gradient(45deg, transparent 50%, #6b5348 50%), linear-gradient(135deg, #6b5348 50%, transparent 50%);
	background-position: calc(100% - 16px) calc(50% - 1px), calc(100% - 11px) calc(50% - 1px);
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
}
.ny-rel-date select:not(.is-set) {
	color: transparent;
}
.ny-rel-date select option {
	color: var(--ny-ink);
}
.ny-rel-kin { margin-top: .45rem; }
.ny-rel-kin label { margin-top: 0; }

.ny-rel-submit {
	display: block;
	width: 100%;
	min-height: 52px;
	margin-top: .75rem;
	padding: .7rem 1rem;
	border: 0;
	border-radius: 999px;
	background: var(--ny-purple);
	color: #fff;
	font-size: 1.05rem;
	font-weight: 800;
	line-height: 1.3;
	cursor: pointer;
}
.ny-rel-submit:focus-visible { outline: 3px solid #d7c6ff; outline-offset: 2px; }
.ny-rel-submit:disabled { cursor: wait; opacity: .72; }
.ny-rel-error:empty { display: none; }
.ny-rel-error {
	margin: .7rem 0 0;
	padding: .7rem .85rem;
	border: 1px solid #e7b4b0;
	border-radius: 12px;
	background: #fff6f4;
	color: #8d2f2f;
	font-weight: 800;
}

.ny-rel-result { margin-top: 1rem; }
.ny-rel-cards {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	gap: .2rem;
	align-items: start;
}
.ny-rel-slot {
	min-width: 0;
	container-type: inline-size;
}
.ny-rel-times {
	align-self: center;
	margin: 0 0 3.2rem;
	color: #b191ff;
	font-size: 1.15rem;
	font-weight: 900;
	line-height: 1;
}
.ny-rel-zcard {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: .1em;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	padding: .22em .35em .28em;
	border: 2px solid rgba(177, 145, 255, .35);
	border-radius: 16px;
	background: #F5F0FF;
	box-shadow: 0 8px 20px rgba(60, 40, 90, .08);
	color: #4a3f6b;
	font-size: clamp(10px, 13.6cqi, 15px);
	text-align: center;
	overflow: hidden;
}
.ny-rel-zcard .nk-kinzukan-card__head {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.ny-rel-zcard .nk-kinzukan-card__num {
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: .15em;
	max-width: 100%;
	margin: 0;
	padding: 0 .1em;
	overflow: hidden;
	color: #8a7fad;
	font-size: 1em;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
	box-sizing: border-box;
}
.ny-rel-zcard .nk-kinzukan-card__num-label {
	flex-shrink: 0;
	font-size: 1em;
	font-weight: 800;
	letter-spacing: .02em;
	white-space: nowrap;
}
.ny-rel-zcard .nk-kinzukan-card__num-digit {
	display: inline-block;
	flex-shrink: 0;
	font-size: 2.35em;
	font-weight: 900;
	line-height: 1;
	white-space: nowrap;
	transform-origin: 50% 82%;
}
.ny-rel-zcard .nk-kinzukan-card__visual {
	position: relative;
	width: 100%;
}
.ny-rel-zcard .nk-kinzukan-card__img {
	position: relative;
	width: 100%;
	margin: .04em auto .06em;
	aspect-ratio: 1 / 1;
	overflow: hidden;
}
.ny-rel-visual--fallback { display: grid; place-items: center; }
.ny-rel-visual--fallback img { width: 70%; height: auto; }
.ny-rel .nk-kinzukan-card__img > .layered-images-container,
.ny-rel .nk-kinzukan-card__img > .nekoyomi-share-layered-figures {
	position: relative;
	width: 100%;
	max-width: 100%;
	height: 100%;
	margin: 0;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: transparent;
}
.ny-rel .nekoyomi-share-layer {
	position: absolute;
	display: block;
	box-sizing: border-box;
	object-fit: contain;
	pointer-events: none;
}
.ny-rel .nk-kinzukan-card__img .nekoyomi-share-figures {
	position: absolute;
	inset: 0;
	transform: translateX(var(--nk-kinzukan-figure-x, 0%)) translateY(var(--nk-share-figures-y, 50%)) scale(calc(var(--nk-share-layout-scale, 2) * var(--nk-kinzukan-figure-scale-mul, 1.2)));
	transform-origin: 50% 78%;
	pointer-events: none;
}
.ny-rel .nekoyomi-share-layer--tone-back,
.ny-rel .nekoyomi-share-layer--tone-front {
	left: 50%;
	top: 50%;
	width: var(--nk-share-tone-size, 44%);
	height: var(--nk-share-tone-size, 44%);
	transform: translate(-50%, calc(var(--nk-share-layer-y, var(--nk-share-tone-y, -46%)) + var(--nk-share-tone-y-offset, -40%)));
}
.ny-rel .nekoyomi-share-layer--tone-back { z-index: 2; }
.ny-rel .nekoyomi-share-layer--tone-front { z-index: 5; }
.ny-rel .nekoyomi-share-layer--ws,
.ny-rel .nekoyomi-share-layer--solar {
	left: 50%;
	top: 50%;
	width: var(--nk-share-seal-w, 16%);
}
.ny-rel .nekoyomi-share-layer--ws {
	z-index: 4;
	transform: translate(calc(-50% + var(--nk-share-ws-x, 30%)), calc(var(--nk-share-layer-y, var(--nk-share-seal-y, -40%)) + var(--nk-share-seal-y-offset, -25%)));
	margin-left: var(--nk-share-ws-ml, 0%);
	margin-top: var(--nk-share-ws-mt, 0%);
}
.ny-rel .nekoyomi-share-layer--solar {
	z-index: 3;
	transform: translate(calc(-50% + var(--nk-share-solar-x, -30%)), calc(var(--nk-share-layer-y, var(--nk-share-seal-y, -40%)) + var(--nk-share-seal-y-offset, -25%)));
	margin-left: var(--nk-share-solar-ml, 0%);
	margin-top: var(--nk-share-solar-mt, 0%);
}
.ny-rel .nekoyomi-seal-img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: contain;
	border: 0;
	background: transparent;
}
.ny-rel-zcard .nk-kinzukan-card__pair {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 100%;
	margin: 0;
	overflow: hidden;
	font-size: 1em;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
}
.ny-rel-zcard .nk-kinzukan-card__val {
	display: inline-block;
	max-width: 100%;
	padding: 0 4px;
	border-radius: 6px;
	font-size: inherit;
	font-weight: 800;
	line-height: 1.25;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ny-rel-zcard .nk-kinzukan-card__val.seal-name-赤 { color: #c96a62; background: #ffeceb; }
.ny-rel-zcard .nk-kinzukan-card__val.seal-name-白 { color: #7a8798; background: #f2f5f8; }
.ny-rel-zcard .nk-kinzukan-card__val.seal-name-青 { color: #5a8fbf; background: #eaf4ff; }
.ny-rel-zcard .nk-kinzukan-card__val.seal-name-黄 { color: #a88a3a; background: #fff8e6; }
.ny-rel-who {
	margin: 0 0 .3rem;
	overflow: hidden;
	color: #5f3a8d;
	font-size: clamp(.85rem, 3.6vw, 1.05rem);
	font-weight: 800;
	line-height: 1.3;
	text-align: center;
	white-space: nowrap;
	text-overflow: ellipsis;
}
@media (max-width: 600px) {
	.ny-rel-zcard .nk-kinzukan-card__pair { font-size: .9em; }
}
@media (max-width: 480px) {
	.ny-rel-zcard .nk-kinzukan-card__pair { font-size: .82em; }
}
@media (max-width: 380px) {
	.ny-rel-zcard .nk-kinzukan-card__pair { font-size: .74em; }
}
.ny-rel a.ny-rel-more {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 44px;
	margin-top: .4rem;
	padding: .35rem .4rem;
	box-sizing: border-box;
	border-radius: 999px;
	background: #6a4f9a;
	color: #fff;
	font-size: clamp(12px, 3.4vw, 14px);
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
}
.ny-rel-more:focus-visible { outline: 2px solid #5f3a8d; outline-offset: 2px; }

.ny-rel-found { margin-top: .9rem; }
.ny-rel-found h2,
#ny-rel-found-title,
.ny-rel-block,
#ny-rel-form,
.ny-rel-share,
.ny-rel-note,
.ny-rel-again {
	scroll-margin-top: var(--ny-header-offset);
	scroll-margin-bottom: calc(7rem + env(safe-area-inset-bottom));
}
.ny-rel-found h2 {
	margin: 0 0 .45rem;
	font-size: 1.15rem;
}
.ny-rel-found ul {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ny-rel-chip {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: .3rem .7rem;
	border: 1px solid transparent;
	border-radius: 999px;
	font-size: .86rem;
	font-weight: 800;
	text-decoration: none;
}
.ny-rel-chip--similar { background: #f4efff; color: #5d4a86; }
.ny-rel-chip--opposite { background: #eef6fb; color: #3d5f78; }
.ny-rel-chip--mystic { background: #f7f0fa; color: #6a4d78; }
.ny-rel-chip--guide { background: #fff4ea; color: #7a5336; }
.ny-rel-chip--mirror { background: #eef8f4; color: #3d6b5c; }
.ny-rel-chip--abs_opp { background: #f8f1ea; color: #6d5346; }
.ny-rel-chip--same_kin { background: #fff8ee; color: #6d5346; }
.ny-rel-chip--tone_group,
.ny-rel-chip--tone_neighbor,
.ny-rel-chip--same_castle { background: #f7f4ee; color: #5c4a38; }

.ny-rel-block {
	margin: .75rem 0;
	padding: .9rem .85rem 1rem;
	border: 1px solid var(--ny-line);
	border-radius: 16px;
	background: #fff;
}
.ny-rel-block h3 {
	margin: 0 0 .4rem;
	font-size: 1.25rem;
}
.ny-rel-block--similar { background: #fbf8ff; }
.ny-rel-block--opposite { background: #f7fbfe; }
.ny-rel-block--mystic { background: #fbf7fc; }
.ny-rel-block--guide { background: #fffaf6; }
.ny-rel-block--mirror { background: #f6fbf8; }
.ny-rel-block--abs_opp { background: #fbf7f3; }
.ny-rel-block--same_kin { background: #fffaf4; }
.ny-rel-block--none { background: var(--ny-cream); }
.ny-rel-direction {
	display: block;
	width: fit-content;
	max-width: 100%;
	margin: 0 0 .35rem;
	padding: .28rem .6rem;
	border-radius: 12px;
	background: rgba(255, 255, 255, .8);
	font-size: .82rem;
	font-weight: 800;
	line-height: 1.45;
}
.ny-rel-hitokoto {
	margin: .35rem 0;
	font-size: 1.08rem;
	font-weight: 800;
	line-height: 1.5;
	line-break: strict;
}
.ny-rel-body { margin: .35rem 0; line-break: strict; }
.ny-rel-how {
	margin: .6rem 0 0;
	padding: .65rem .75rem;
	border-radius: 12px;
	background: rgba(255, 248, 242, .9);
	line-height: 1.65;
}
.ny-rel-how span {
	display: block;
	margin-bottom: .15rem;
	color: var(--ny-purple);
	font-weight: 800;
}
.ny-rel-links { display: flex; flex-wrap: wrap; gap: .35rem .8rem; }

.ny-rel-share { margin-top: 1rem; }
.ny-rel-share-main {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	line-height: 0;
	cursor: pointer;
}
.ny-rel-share-main img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 800 / 533;
	object-fit: contain;
}
.ny-rel-share-main:focus-visible { outline: 2px solid #5f3a8d; outline-offset: 3px; }
.ny-rel-share-status:empty { display: none; }
.ny-rel-share-status {
	margin: .4rem 0 0;
	color: var(--ny-brown);
	font-size: .86rem;
}

.ny-rel-note { margin-top: 1.1rem; }
.ny-rel-note h2 { margin: 0 0 .45rem; font-size: 1.08rem; }
.ny-rel-note-card {
	display: grid;
	gap: .25rem;
	padding: .75rem;
	border: 1px solid var(--ny-line);
	border-radius: 16px;
	background: #fff;
	color: inherit;
	text-decoration: none;
}
.ny-rel-note-card img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1280 / 670;
	object-fit: cover;
	border-radius: 12px;
}
.ny-rel-note-mark { color: #c48a3a; font-weight: 800; }
.ny-rel-note-card strong { font-size: 1.02rem; line-height: 1.45; }
.ny-rel-note-card span:last-child { color: var(--ny-brown); font-size: .9rem; }
.ny-rel-again {
	display: block;
	width: 100%;
	min-height: 48px;
	margin-top: .9rem;
	padding: .65rem 1rem;
	border: 1px solid #d9c7ea;
	border-radius: 999px;
	background: #fff;
	color: var(--ny-purple);
	font-weight: 800;
	cursor: pointer;
}

@container (min-width: 460px) {
	.ny-rel-pair { grid-template-columns: 1fr 1fr; align-items: start; }
	.ny-rel-tabs button { font-size: .78rem; }
}

.ny-rel-about h1 { margin: 0 0 .6rem; color: #5f3a8d; font-size: clamp(1.5rem, 4vw, 2rem); }
.ny-rel-about h2 { margin: 1rem 0 .4rem; font-size: 1.2rem; }
.ny-rel-about h3 { margin: .8rem 0 .3rem; font-size: 1rem; }
html:has(.ny-rel) { scroll-padding-top: var(--nk-header-sticky-height, 80px); }
