:root {
	--ep-ink: #122531;
	--ep-navy: #173044;
	--ep-teal: #2e7180;
	--ep-sky: #86b9c4;
	--ep-cream: #f4eedf;
	--ep-paper: #fffdf5;
	--ep-gold: #d7b75a;
	--ep-red: #b55449;
}

html:has(.entrance-drum-site),
body:has(.entrance-drum-site) {
	margin: 0 !important;
	padding: 0 !important;
	background-color: var(--ep-cream) !important;
	background-image:
		linear-gradient(#f4eedf4d, #f4eedf4d),
		url("../images/entrance-page-background.png") !important;
	background-position: center top !important;
	background-size: cover !important;
	background-repeat: no-repeat !important;
	background-attachment: fixed !important;
	overflow-x: clip !important;
}

body:has(.entrance-drum-site) .site-header,
body:has(.entrance-drum-site) .site-footer {
	display: none !important;
}

.entrance-drum-site,
.entrance-drum-site * { box-sizing: border-box; }

.entrance-drum-site {
	position: relative;
	min-height: 100svh;
	background: transparent;
	color: var(--ep-ink);
	font-family: system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
	overflow-x: clip;
	isolation: isolate;
}

.entrance-shell--top {
	position: fixed !important;
	z-index: 100;
	top: 0;
	left: 0;
	right: 0;
	height: 20px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 0 10px !important;
	border: 0 !important;
	background: transparent !important;
	color: #fff !important;
	pointer-events: none;
}
.entrance-shell--top > * { pointer-events: auto; }
.entrance-shell--bottom { display: none !important; }
.entrance-shell__brand { font: 900 8px/1 monospace; letter-spacing: .13em; opacity: .8; }
.entrance-shell__actions { display: flex; gap: 3px; }
.entrance-shell__actions button {
	min-width: 28px;
	padding: 2px 5px;
	border: 0;
	background: transparent;
	color: #fff;
	font: 800 7px/1 monospace;
	cursor: pointer;
	opacity: .52;
}
.entrance-shell__actions button:hover,
.entrance-shell__actions button:focus-visible { background: #ffffff24; opacity: 1; }

/* INFORMATION */
.entrance-info {
	position: relative !important;
	display: grid;
	place-items: center;
	min-height: 100svh !important;
	padding: clamp(42px, 6vh, 68px) clamp(16px, 4vw, 64px) clamp(40px, 6vh, 62px) !important;
	background:
		linear-gradient(90deg, #1730440b 1px, transparent 1px),
		linear-gradient(#1730440b 1px, transparent 1px) !important;
	background-size: 28px 28px !important;
}
.entrance-info__inner { width: min(1120px, 100%); margin: auto; }
.entrance-kicker {
	margin: 0 0 5px;
	color: var(--ep-teal);
	font: 900 clamp(10px, 1vw, 13px)/1.2 monospace;
	letter-spacing: .22em;
}
.entrance-info h1 {
	margin: 0;
	font-size: clamp(46px, 8vw, 108px);
	font-weight: 950;
	line-height: .88;
	letter-spacing: -.055em;
}
.entrance-info__lead {
	margin: clamp(12px, 2vh, 22px) 0 clamp(18px, 3vh, 34px);
	font-size: clamp(15px, 1.7vw, 22px);
	font-weight: 800;
	letter-spacing: .04em;
}
.entrance-info__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
	gap: clamp(14px, 2.2vw, 28px);
	align-items: stretch;
}
.entrance-info__card,
.entrance-info__staff article {
	border: 2px solid var(--ep-ink);
	background: #fffdf5f2;
	box-shadow: 7px 7px 0 var(--ep-ink);
}
.entrance-info__card { padding: clamp(18px, 2.5vw, 30px); }
.entrance-info__card > span,
.entrance-info__staff small {
	display: block;
	color: var(--ep-teal);
	font: 900 11px/1 monospace;
	letter-spacing: .17em;
}
.entrance-info__card h2 {
	margin: 9px 0 18px;
	font-size: clamp(27px, 3vw, 43px);
	line-height: 1.05;
}
.entrance-info__card dl { margin: 0; border-top: 1px solid #17304455; }
.entrance-info__card dl > div {
	display: grid;
	grid-template-columns: 86px 1fr;
	gap: 12px;
	padding: 8px 0;
	border-bottom: 1px solid #17304438;
}
.entrance-info__card dt { font: 900 11px/1.6 monospace; letter-spacing: .08em; }
.entrance-info__card dd { margin: 0; font-size: clamp(13px, 1.15vw, 16px); font-weight: 750; }
.entrance-info__card > p { margin: 14px 0 0; font-size: 11px; line-height: 1.65; }
.entrance-info__staff { display: grid; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 2vh, 18px); }
.entrance-info__staff article {
	display: grid;
	grid-template-columns: minmax(120px, 43%) 1fr;
	align-items: center;
	min-height: 0;
	overflow: hidden;
	box-shadow: 6px 6px 0 var(--ep-teal);
}
.entrance-info__staff .worker-character {
	width: 100% !important;
	height: 100% !important;
	min-height: 164px;
	margin: 0 !important;
	background-size: contain !important;
	background-position: center bottom !important;
	animation-duration: 4.8s !important;
}
.entrance-info__staff article > div:last-child { padding: 16px 16px 16px 8px; }
.entrance-info__staff strong { display: block; margin-top: 7px; font-size: clamp(18px, 2vw, 28px); line-height: 1.15; }
.entrance-info__staff p { margin: 8px 0 0; font-size: 13px; }
.entrance-info__enter {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	width: min(330px, 100%);
	margin: clamp(20px, 3vh, 34px) auto 0 !important;
	padding: 13px 22px;
	border: 2px solid var(--ep-ink);
	background: var(--ep-gold);
	color: var(--ep-ink);
	font: 900 15px/1 sans-serif;
	box-shadow: 5px 5px 0 var(--ep-ink);
	cursor: pointer;
}
.entrance-info__enter > span:first-child { white-space: nowrap; }
.entrance-info__swipe-hand {
	display: block;
	width: 30px;
	height: 44px;
	flex: 0 0 auto;
	transform-origin: 50% 18%;
	animation: entrance-swipe-invite 1.25s steps(3, end) infinite;
}
.entrance-info__swipe-hand svg { display: block; width: 100%; height: 100%; overflow: visible; }
@keyframes entrance-swipe-invite {
	0%, 100% { transform: translateY(-3px) rotate(180deg); }
	65% { transform: translateY(7px) rotate(180deg); }
}
.entrance-info__enter:hover,
.entrance-info__enter:focus-visible { transform: translate(2px, 2px); box-shadow: 3px 3px 0 var(--ep-ink); }

/* 平面コロニー：表示中の1面だけを幅いっぱいに置く。 */
.entrance-drum-view {
	position: relative !important;
	display: none;
	min-height: 100svh;
	background: transparent;
	overflow: clip;
}
.entrance-drum-site.is-board-entered .entrance-drum-view { display: block; }
.entrance-drum-site.is-board-entered .entrance-info { display: grid; }
.entrance-drum-site.is-board-entered .entrance-info__enter { display: none; }
.entrance-drum__scene { position: relative !important; width: 100%; min-height: 100svh; overflow: clip !important; touch-action: pan-y !important; }
.entrance-drum { position: relative !important; width: 100% !important; min-height: 100svh; }
.entrance-drum__face {
	position: relative !important;
	display: none;
	width: 100% !important;
	min-height: 100svh !important;
	padding: 32px clamp(8px, 2vw, 24px) 46px !important;
	border: 0 !important;
	background: transparent;
	box-shadow: none !important;
	overflow: visible !important;
}
.entrance-drum__face.is-active { display: block; }
.entrance-drum__face.is-entering,
.entrance-drum__face.is-leaving {
	position: absolute !important;
	inset: 0 !important;
	display: block;
	z-index: 2;
	transition: transform .46s cubic-bezier(.22, .72, .2, 1), opacity .46s ease;
	will-change: transform, opacity;
}
.entrance-drum__face.is-leaving { z-index: 1; }
.entrance-drum__edge { display: none !important; }
.entrance-drum__status {
	position: fixed;
	z-index: 95;
	left: 50%;
	bottom: 4px;
	transform: translateX(-50%);
	color: #fff;
	font: 900 8px/1 monospace;
	letter-spacing: .13em;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}
.entrance-axis-guide {
	position: fixed;
	z-index: 96;
	left: 50%;
	bottom: 24px;
	transform: translateX(-50%);
	padding: 7px 13px;
	border: 1px solid #f9f1dd;
	background: #122531e8;
	color: #fffdf5;
	font: 800 11px/1.1 system-ui, sans-serif;
	letter-spacing: .08em;
	box-shadow: 3px 3px 0 #0008;
	white-space: nowrap;
	pointer-events: none;
	opacity: 0;
	visibility: hidden;
	transition: opacity .2s ease;
}
.entrance-drum-site.is-drum-in-view .entrance-drum__status { opacity: .78; visibility: visible; }
.entrance-drum-site.is-drum-in-view .entrance-axis-guide { opacity: 1; visibility: visible; }
.entrance-axis-guide__sp { display: none; }

.entrance-colony-head { width: min(1120px, calc(100% - 20px)); margin: 10px auto 24px; }
.entrance-colony-head small { color: var(--ep-teal); font: 900 10px/1 monospace; letter-spacing: .18em; }
.entrance-colony-head h2 { margin: 5px 0; font-size: clamp(34px, 5vw, 70px); line-height: 1; letter-spacing: -.035em; }
.entrance-colony-head p { margin: 0; font-size: clamp(13px, 1.4vw, 18px); font-weight: 700; }
.entrance-beginner-placeholder {
	width: min(920px, calc(100% - 20px));
	margin: clamp(40px, 12vh, 120px) auto;
	padding: clamp(28px, 5vw, 70px);
	border: 2px dashed var(--ep-teal);
	background: #fff9;
	text-align: center;
}
.entrance-beginner-placeholder strong { font-size: clamp(32px, 7vw, 86px); }

/* PC黒板は完成済みの骨格を維持し、紙面が見える程度だけ一回り小さくする。 */
@media (min-width: 761px) {
	.entrance-drum__face--board { padding: 28px 4px 40px !important; }
	.entrance-drum__face--board .blackboard-v2 {
		left: 50% !important;
		width: 90vw !important;
		height: calc(100svh - 90px) !important;
		max-width: none !important;
		margin: 0 !important;
		transform: translateX(-50%) !important;
	}
	.entrance-drum__face--board .blackboard-v2__surface {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) !important;
		grid-template-areas: "left right" !important;
		width: 100% !important;
		height: 100% !important;
		min-height: 0 !important;
		overflow: hidden !important;
	}
}

@media (max-width: 760px) {
	html:has(.entrance-drum-site),
	body:has(.entrance-drum-site) {
		background-color: var(--ep-cream) !important;
		background-image: none !important;
	}
	.entrance-drum-site::before {
		content: "";
		position: fixed;
		z-index: -1;
		inset: 0;
		background:
			linear-gradient(#f4eedf4d, #f4eedf4d),
			url("../images/entrance-page-background-mobile.png") center / cover no-repeat;
		pointer-events: none;
	}
	.entrance-drum-site { overflow: visible !important; }
	.entrance-info { min-height: 100svh !important; padding: 38px 12px 42px !important; }
	.entrance-info h1 { font-size: clamp(36px, 12vw, 48px); letter-spacing: -.06em; }
	.entrance-info__grid { grid-template-columns: 1fr; }
	.entrance-info__card { padding: 18px; }
	.entrance-info__staff { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; }
	.entrance-info__staff article { display: block; }
	.entrance-info__staff .worker-character { min-height: 132px; }
	.entrance-info__staff article > div:last-child { padding: 10px; }
	.entrance-info__staff strong { font-size: 15px; }
	.entrance-info__staff p { font-size: 11px; }
	.entrance-drum-view { display: none !important; }
	.entrance-drum-site.is-board-entered .entrance-drum-view { display: block !important; }
	.entrance-drum__face { min-height: 100svh !important; padding: 29px 3px 38px !important; }
	.entrance-drum__face--board { padding-inline: 3vw !important; }
	.entrance-drum__face--board .blackboard-v2 {
		left: 50% !important;
		width: 94vw !important;
		max-width: 94vw !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		transform: translateX(-50%) !important;
	}
	.entrance-axis-guide { bottom: 27px; font-size: 10px; }
	.entrance-axis-guide__pc { display: none; }
	.entrance-axis-guide__sp { display: inline; }
	.entrance-shell__brand { font-size: 7px; }
	.entrance-shell__actions button { font-size: 6px; }
}

@media (max-height: 720px) and (min-width: 761px) {
	.entrance-info { padding-top: 34px !important; padding-bottom: 32px !important; }
	.entrance-info__lead { margin-block: 9px 16px; }
	.entrance-info__staff .worker-character { min-height: 138px; }
	.entrance-info__enter { margin-top: 16px !important; }
}

@media (prefers-reduced-motion: reduce) {
	.entrance-drum__face.is-entering,
	.entrance-drum__face.is-leaving { transition: none !important; }
	.entrance-info__staff .worker-character { animation: none !important; }
	.entrance-info__swipe-hand { animation: none !important; }
}

/* v7.0.0 — information / colonies */
.screen-reader-text {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.entrance-info__inner {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas:
		"replay"
		"kicker"
		"title"
		"lead"
		"content"
		"enter";
	column-gap: clamp(18px, 3vw, 42px);
}
.entrance-opening-v7-replay {
	grid-area: replay;
	justify-self: start;
	margin: 0 0 10px;
	padding: 5px 9px;
	border: 1px solid #fff;
	background: #122531c9;
	color: #fff;
	font: 800 10px/1 monospace;
	letter-spacing: .08em;
	cursor: pointer;
}
.entrance-kicker { grid-area: kicker; align-self: end; }
.entrance-info h1 {
	grid-area: title;
	color: var(--ep-ink);
	-webkit-text-stroke: clamp(1.5px, .16vw, 2.5px) #fff;
	paint-order: stroke fill;
	text-shadow: 0 2px 0 #fff;
}
.entrance-info__lead { grid-area: lead; align-self: start; }
.entrance-info__grid { grid-area: content; }
.entrance-info__enter { grid-area: enter; }
.entrance-drum-site.is-board-entered .entrance-info {
	margin-top: clamp(58px, 9vh, 110px) !important;
}

/* Text instructions were too noisy. The direction is now shown by two thin edge arrows. */
.entrance-axis-guide { display: none !important; }
.entrance-edge-arrow {
	position: fixed;
	z-index: 96;
	top: 50%;
	display: block;
	width: 54px;
	height: 54px;
	padding: 0;
	border: 0;
	background: transparent;
	color: #d7b75a;
	opacity: 0;
	visibility: hidden;
	cursor: pointer;
	transition: color .18s ease, opacity .18s ease;
}
.entrance-drum-site.is-drum-in-view .entrance-edge-arrow { opacity: .58; visibility: visible; }
.entrance-edge-arrow--prev { left: 12px; }
.entrance-edge-arrow--next { right: 12px; }
.entrance-edge-arrow::before {
	content: "";
	position: absolute;
	top: 26px;
	width: 38px;
	height: 1.5px;
	background: currentColor;
	box-shadow: 0 0 7px #fff5;
}
.entrance-edge-arrow::after {
	content: "";
	position: absolute;
	top: 18px;
	width: 16px;
	height: 16px;
	border-top: 1.5px solid currentColor;
	border-left: 1.5px solid currentColor;
}
.entrance-edge-arrow--prev::before { left: 7px; }
.entrance-edge-arrow--prev::after { left: 7px; transform: rotate(-45deg); }
.entrance-edge-arrow--next::before { right: 7px; }
.entrance-edge-arrow--next::after { right: 7px; transform: rotate(135deg); }
.entrance-edge-arrow--prev { animation: entrance-edge-pulse-prev 5s ease-in-out infinite; }
.entrance-edge-arrow--next { animation: entrance-edge-pulse-next 5s ease-in-out infinite; }
.entrance-edge-arrow:hover,
.entrance-edge-arrow:focus-visible { color: #9a7724; opacity: 1 !important; outline: 1px dotted currentColor; outline-offset: 3px; }
@keyframes entrance-edge-pulse-prev {
	0%, 77%, 100% { translate: 0 0; filter: brightness(1); }
	84% { translate: -5px 0; filter: brightness(1.55); }
	91% { translate: 0 0; filter: brightness(1); }
}
@keyframes entrance-edge-pulse-next {
	0%, 77%, 100% { translate: 0 0; filter: brightness(1); }
	84% { translate: 5px 0; filter: brightness(1.55); }
	91% { translate: 0 0; filter: brightness(1); }
}

/* Event cards: nearest upcoming first, completed events follow. */
.entrance-drum__face--events .entrance-event-archive {
	width: min(1120px, calc(100% - 28px));
	max-width: 1120px;
	margin: clamp(30px, 7vh, 76px) auto 70px;
	padding: 0;
}
.entrance-event-archive__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(14px, 2vw, 24px);
}
.entrance-event-mini-poster {
	position: relative;
	display: grid;
	grid-template-rows: auto 1fr auto;
	min-height: 230px;
	padding: 20px;
	border: 3px solid var(--ep-ink);
	background: #fffdf5f2;
	color: var(--ep-ink);
	text-decoration: none;
	box-shadow: 7px 7px 0 var(--ep-ink);
	overflow: hidden;
	transition: transform .18s ease, box-shadow .18s ease;
}
.entrance-event-mini-poster::after {
	content: "";
	position: absolute;
	inset: auto -24px -42px auto;
	width: 110px;
	height: 110px;
	border: 16px solid #2e718023;
	border-radius: 50%;
}
.entrance-event-mini-poster > span {
	justify-self: start;
	padding: 5px 8px;
	background: var(--ep-ink);
	color: #fff;
	font: 900 11px/1 monospace;
	letter-spacing: .13em;
}
.entrance-event-mini-poster.is-result > span { background: var(--ep-teal); }
.entrance-event-mini-poster strong { align-self: center; font-size: clamp(21px, 2.1vw, 31px); line-height: 1.22; }
.entrance-event-mini-poster time { font: 900 13px/1.3 monospace; }
.entrance-event-mini-poster:hover,
.entrance-event-mini-poster:focus-visible { transform: translate(3px, 3px); box-shadow: 4px 4px 0 var(--ep-ink); }

/* Beginner colony: the first action flips; the second opens the fixed page. */
.entrance-beginner-cards {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(14px, 2vw, 25px);
	width: min(1120px, calc(100% - 28px));
	margin: clamp(34px, 8vh, 92px) auto 60px;
	perspective: 1400px;
}
.entrance-beginner-card {
	position: relative;
	display: block;
	aspect-ratio: 5 / 7;
	color: var(--ep-ink);
	text-decoration: none;
	transform-style: preserve-3d;
	transition: transform .62s cubic-bezier(.2,.72,.22,1);
}
.entrance-beginner-card.is-flipped { transform: rotateY(180deg); }
.entrance-beginner-card__front,
.entrance-beginner-card__back {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	padding: clamp(14px, 2vw, 24px);
	border: 4px solid var(--ep-ink);
	background: #fffdf5;
	box-shadow: 8px 8px 0 var(--ep-ink);
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	overflow: hidden;
}
.entrance-beginner-card__front::before,
.entrance-beginner-card__front::after {
	content: "";
	position: absolute;
	inset: 9px;
	border: 1px solid currentColor;
	pointer-events: none;
}
.entrance-beginner-card__front::after { inset: 14px; border-style: dashed; opacity: .42; }
.entrance-beginner-card__front i { font-size: clamp(42px, 5vw, 72px); font-style: normal; line-height: 1; }
.entrance-beginner-card__front strong { font-size: clamp(19px, 2vw, 27px); text-align: center; }
.entrance-beginner-card__front small { position: absolute; right: 17px; bottom: 14px; font: 900 14px/1 monospace; }
.entrance-beginner-card__back {
	grid-template-rows: auto 1fr auto;
	align-items: center;
	background: var(--ep-ink);
	color: #fffdf5;
	text-align: center;
	transform: rotateY(180deg);
}
.entrance-beginner-card__back strong { font-size: clamp(20px, 2vw, 29px); }
.entrance-beginner-card__back p { margin: 12px 0; font-size: clamp(12px, 1.2vw, 16px); line-height: 1.7; }
.entrance-beginner-card__back b { padding: 9px 12px; border: 1px solid #fffdf5; font-size: 12px; }
.entrance-beginner-card.is-heart,
.entrance-beginner-card.is-diamond { color: var(--ep-red); }

@media (max-width: 760px) {
	html:has(.entrance-drum-site),
	body:has(.entrance-drum-site) {
		background-attachment: fixed !important;
		background-size: cover !important;
		background-repeat: no-repeat !important;
	}
	.entrance-info__inner { display: block; }
	.entrance-opening-v7-replay { margin-bottom: 10px; }
	.entrance-drum-site.is-board-entered .entrance-info { margin-top: 48px !important; }
	.entrance-edge-arrow { width: 40px; height: 46px; }
	.entrance-edge-arrow--prev { left: 3px; }
	.entrance-edge-arrow--next { right: 3px; }
	.entrance-edge-arrow::before { top: 23px; width: 28px; }
	.entrance-edge-arrow::after { top: 17px; width: 12px; height: 12px; }
	.entrance-event-archive__grid { grid-template-columns: 1fr; }
	.entrance-event-mini-poster { min-height: 170px; }
	.entrance-beginner-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin-top: 28px; }
	.entrance-beginner-card__front,
	.entrance-beginner-card__back { border-width: 3px; box-shadow: 5px 5px 0 var(--ep-ink); }
	.entrance-beginner-card__front strong { font-size: clamp(16px, 5vw, 22px); }
}


@media (prefers-reduced-motion: reduce) {
	.entrance-edge-arrow { animation: none !important; }
	.entrance-beginner-card { transition: none !important; }
}

/* =========================================================
   v7.1.0 — COLONY MAP / kiosk / passport / safe board scale
   ========================================================= */

/* The old always-on 20px shell is replaced by a map which appears only when
   it is asked for. */
.entrance-shell--top { display: none !important; }
.entrance-mapbar {
	position: fixed;
	z-index: 100020;
	top: var(--wp-admin--admin-bar--height, 0px);
	left: 50%;
	display: flex;
	align-items: center;
	gap: 4px;
	width: min(820px, calc(100vw - 42px));
	min-height: 42px;
	padding: 6px 9px;
	border: 1px solid #d7b75a99;
	border-top: 0;
	background: #102331f2;
	box-shadow: 0 9px 28px #07151fc2;
	transform: translate(-50%, 0);
	transition: transform .2s ease;
	backdrop-filter: blur(8px);
}
.entrance-mapbar.is-visible,
.entrance-mapbar:focus-within { transform: translate(-50%, 0); }
.entrance-mapbar__title {
	margin-right: 8px;
	padding: 5px 8px;
	border: 1px solid #d7b75a;
	color: #d7b75a;
	font: 900 10px/1 monospace;
	letter-spacing: .18em;
}
.entrance-mapbar button {
	position: relative;
	flex: 1 1 auto;
	min-height: 28px;
	padding: 4px 7px;
	border: 0;
	background: transparent;
	color: #f4eedf;
	font: 800 10px/1 monospace;
	letter-spacing: .08em;
	cursor: pointer;
}
.entrance-mapbar button::after {
	content: "";
	position: absolute;
	left: 15%; right: 15%; bottom: 1px;
	height: 2px;
	background: #d7b75a;
	box-shadow: 0 0 10px #ffe69d;
	transform: scaleX(0);
	transition: transform .16s ease;
}
.entrance-mapbar button:hover::after,
.entrance-mapbar button:focus-visible::after,
.entrance-mapbar button.is-current::after { transform: scaleX(1); }
.entrance-mapbar button.is-current { color: #ffe89f; }

.entrance-map-toggle,
.entrance-mobile-map { display: none; }

/* Entrance kiosk: information remains first, but no longer reads as a set of
   generic web cards. */
@media (min-width: 761px) {
	.entrance-info { padding-top: clamp(30px, 4vh, 48px) !important; padding-bottom: clamp(26px, 4vh, 46px) !important; }
	.entrance-info__inner { width: min(1240px, 96vw); grid-template-columns: minmax(0, 1fr) 294px; }
	.entrance-info__grid {
		grid-template-columns: minmax(340px, 1.1fr) minmax(260px, .78fr) minmax(205px, .58fr);
		gap: clamp(13px, 1.7vw, 24px);
		align-items: center;
	}
	.entrance-info__card {
		position: relative;
		border: 1px solid #173044aa;
		border-radius: 0;
		box-shadow: 5px 6px 0 #173044;
		transform: rotate(-.35deg);
	}
	.entrance-info__card::before {
		content: "INFORMATION";
		position: absolute;
		right: 14px; top: -10px;
		padding: 5px 9px;
		background: #d7b75a;
		color: #122531;
		font: 900 9px/1 monospace;
		letter-spacing: .12em;
		transform: rotate(2deg);
	}
	.entrance-info__staff { grid-template-rows: repeat(2, minmax(116px, 1fr)); gap: 10px; }
	.entrance-info__staff article { grid-template-columns: 94px 1fr; border: 0; border-left: 3px solid #d7b75a; box-shadow: none; background: #fffdf5d9; }
	.entrance-info__staff .worker-character { min-height: 116px; }
	.entrance-info__staff article > div:last-child { padding: 10px 9px 10px 0; }
}
.entrance-info__photos {
	position: relative;
	display: grid;
	place-items: center;
	min-height: 285px;
	padding: 20px;
}
.entrance-info__photos::before {
	content: "SHOP PHOTO FILE";
	position: absolute;
	left: 2px; top: 2px;
	color: #173044a8;
	font: 900 9px/1 monospace;
	letter-spacing: .17em;
}
.entrance-info__photos figure {
	position: absolute;
	width: 72%;
	aspect-ratio: 4 / 3;
	margin: 0;
	padding: 9px 9px 28px;
	border: 1px solid #17304477;
	background:
		linear-gradient(135deg, #17304416, transparent 44%),
		repeating-linear-gradient(-35deg, #86b9c41f 0 9px, #fffdf5 10px 18px),
		#fffdf5;
	box-shadow: 4px 7px 12px #1225313b;
	color: #173044;
}
.entrance-info__photos figure::before {
	content: "PHOTO";
	position: absolute;
	inset: 9px 9px 28px;
	display: grid;
	place-items: center;
	border: 1px dashed #17304447;
	font: 900 10px/1 monospace;
	letter-spacing: .16em;
	opacity: .52;
}
.entrance-info__photos figure span { position: absolute; left: 11px; bottom: 8px; font: 900 9px/1 monospace; letter-spacing: .12em; }
.entrance-info__photos figure b { position: absolute; right: 10px; bottom: 7px; font-size: 10px; }
.entrance-info__photos .is-exterior { translate: -12% -25%; rotate: -5deg; }
.entrance-info__photos .is-shop { translate: 14% 0; rotate: 4deg; }
.entrance-info__photos .is-play { translate: -7% 27%; rotate: -1deg; }

/* One designed blackboard canvas; its JS wrapper owns the scale. */
.blackboard-v2-fit-stage { position: relative; flex: 0 0 auto; margin: 0 auto; overflow: visible; }
@media (min-width: 761px) {
	.entrance-drum__face--board { overflow: visible !important; }
	.blackboard-v2-fit-stage .blackboard-v2 { margin-top: 0 !important; margin-bottom: 0 !important; max-width: none !important; max-height: none !important; }
	.blackboard-v2-fit-stage .blackboard-v2__surface { overflow: hidden !important; }
	.entrance-drum__face--board .blackboard-v2-fit-stage { margin-top: 18px; margin-bottom: 28px; }
	.entrance-drum-site.is-drum-in-view .entrance-edge-arrow { opacity: 0; }
	.entrance-drum-site.is-drum-in-view .entrance-drum-view:hover .entrance-edge-arrow,
	.entrance-drum-site.is-drum-in-view .entrance-edge-arrow:focus-visible { opacity: .72; }
}

/* PASSPORT overlays the existing membership functions; URLs and forms remain
   exactly the same. */
.entrance-drum__face--member { background: radial-gradient(circle at 50% 10%, #d7eef2, #6f9baa 52%, #284e64) !important; }
.entrance-member-intro {
	position: relative;
	width: min(1080px, calc(100% - 28px));
	border: 2px solid #b79545 !important;
	border-radius: 7px;
	background: linear-gradient(90deg, #f6efd9 0 49.5%, #c9b98e 50%, #f6efd9 50.5% 100%) !important;
	box-shadow: 0 18px 45px #112c3ca3, inset 0 0 0 9px #e3d6b8 !important;
	overflow: hidden;
}
.entrance-member-intro::before {
	content: "ENTRANCE PASSPORT";
	position: absolute;
	left: 50%; top: 11px;
	translate: -50% 0;
	color: #315e79;
	font: 900 11px/1 monospace;
	letter-spacing: .24em;
	opacity: .72;
}
.entrance-member-intro__copy { background: transparent !important; }
.entrance-member-intro__copy > span { background: #315e79 !important; color: #fff !important; border-color: #163a50 !important; }
.entrance-member-intro__status { border-left-color: #315e79 !important; }
.entrance-member-benefits { background: #294e66 !important; }
.entrance-member-benefits > span { background: #c5ad68 !important; color: #102c3d !important; border-color: #102c3d !important; }
.entrance-member-benefits > b { color: #f4dd93 !important; }
.entrance-passport-clerk { margin: -4px 0 12px; color: #315e79; font: 900 12px/1.4 monospace; }
.entrance-passport-stamp-note { padding: 9px 11px; border: 2px dashed #ead78d; color: #fff; font-weight: 900; }
.entrance-passport-stamps { margin-top: 18px; padding: 11px; border: 2px dashed #315e79; background: #fffaf0c7; }
.entrance-passport-stamps > strong { color: #315e79; font: 900 10px/1 monospace; letter-spacing: .15em; }
.entrance-passport-stamps ol { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; margin: 9px 0 7px; padding: 0; list-style: none; }
.entrance-passport-stamps li { display: grid; place-items: center; aspect-ratio: 1; border: 1px dashed #6f8190; border-radius: 50%; color: #87939a; font: 900 10px/1 monospace; }
.entrance-passport-stamps li.is-stamped { border: 3px double #b55449; color: #b55449; transform: rotate(-7deg); }
.entrance-passport-stamps li.is-stamped span::before { content: "VISIT "; font-size: 6px; }
.entrance-passport-stamps > small { color: #315e79; font-size: 10px; font-weight: 900; }

/* SUPPORT remains the same four working links, now framed as support for
   newcomers, returners and experienced players alike. */
.entrance-drum__face--beginner::before {
	content: "SUPPORT  /  はじめても、久しぶりも、もっと遊びたい人も。";
	display: block;
	width: min(1120px, calc(100% - 28px));
	margin: clamp(25px, 5vh, 58px) auto -20px;
	color: #173044;
	font: 900 clamp(12px, 1.4vw, 17px)/1.4 monospace;
	letter-spacing: .08em;
}

/* Supply attraction: a harmless, automatically repaired noisy stall. */
.supply-go-round .supply-carousel-stage::before {
	content: "";
	position: absolute;
	z-index: 2;
	left: 50%; top: 46%;
	width: min(690px, 74vw);
	aspect-ratio: 1;
	border: 22px solid #8f6927;
	border-radius: 50%;
	background:
		radial-gradient(circle, #d7b75a 0 5%, #173044 5.5% 9%, transparent 9.5%),
		repeating-conic-gradient(from 0deg, #8f6927 0 2deg, transparent 2deg 22.5deg);
	box-shadow: inset 0 0 0 6px #e1c66f, 0 0 0 5px #173044, 0 14px 28px #0004;
	transform: translate(-50%, -50%) rotate(-2deg);
	opacity: .52;
	pointer-events: none;
}
.supply-go-round .supply-carousel-stage::after {
	content: "GEAR FERRIS / 稼働中";
	position: absolute;
	z-index: 3;
	left: 50%; top: 45%;
	translate: -50% -50%;
	padding: 7px 12px;
	border: 2px solid #173044;
	background: #d7b75a;
	color: #173044;
	font: 900 10px/1 monospace;
	letter-spacing: .12em;
	transform: rotate(1deg);
	pointer-events: none;
}
.supply-go-round.is-gear-rattling .supply-carousel-stage { animation: entrance-gear-rattle .12s steps(2, end) 5; }
.supply-go-round.is-gear-repairing::after {
	content: "Webてんちょ、自動修理中…";
	position: absolute;
	z-index: 40;
	right: 18px; top: 108px;
	display: grid;
	align-content: end;
	width: 138px; height: 158px;
	padding: 10px;
	border: 2px solid #122531;
	background: #fffdf5 url("../images/webtencho-v1.png") center 8px / 102px auto no-repeat;
	box-shadow: 5px 5px 0 #122531;
	color: #122531;
	font: 900 10px/1.3 monospace;
	text-align: center;
	transform: rotate(2deg);
}
@keyframes entrance-gear-rattle { 0%,100% { translate: 0 0; } 25% { translate: -5px 2px; } 75% { translate: 5px -2px; } }

@media (max-width: 760px) {
	.entrance-mapbar { display: none; }
	.entrance-map-toggle {
		position: fixed;
		z-index: 100022;
		top: calc(var(--wp-admin--admin-bar--height, 0px) + 9px);
		right: 10px;
		display: grid;
		place-content: center;
		gap: 4px;
		width: 40px; height: 40px;
		padding: 0;
		border: 1px solid #d7b75a;
		border-radius: 50%;
		background: #102331e8;
		box-shadow: 0 4px 14px #0008;
		cursor: pointer;
	}
	.entrance-map-toggle i { display: block; width: 18px; height: 1.5px; background: #f4eedf; transition: transform .18s ease, opacity .18s ease; }
	.is-map-open .entrance-map-toggle i:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
	.is-map-open .entrance-map-toggle i:nth-child(2) { opacity: 0; }
	.is-map-open .entrance-map-toggle i:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
	.entrance-mobile-map {
		position: fixed;
		z-index: 100021;
		inset: var(--wp-admin--admin-bar--height, 0px) 0 0 auto;
		display: grid;
		align-content: start;
		width: min(86vw, 350px);
		padding: 20px;
		border-left: 2px solid #d7b75a;
		background: radial-gradient(circle at 90% 0, #2e718055, transparent 32%), #102331f8;
		box-shadow: -18px 0 50px #0009;
		transform: translateX(105%);
		transition: transform .22s ease;
	}
	.is-map-open .entrance-mobile-map { transform: translateX(0); }
	.entrance-mobile-map__head { display: grid; grid-template-columns: 1fr auto auto; align-items: end; gap: 9px; margin-bottom: 24px; color: #f4eedf; }
	.entrance-mobile-map__head span { font: 800 9px/1 monospace; letter-spacing: .18em; }
	.entrance-mobile-map__head b { color: #d7b75a; font: 900 25px/1 monospace; }
	.entrance-mobile-map__head button { border: 0; background: transparent; color: #fff; font-size: 28px; }
	.entrance-mobile-map > button:not([data-map-close]) {
		display: grid;
		grid-template-columns: 36px 1fr;
		align-items: center;
		min-height: 54px;
		padding: 7px 4px;
		border: 0;
		border-bottom: 1px solid #86b9c455;
		background: transparent;
		color: #f4eedf;
		font: 900 15px/1 monospace;
		text-align: left;
	}
	.entrance-mobile-map > button small { color: #d7b75a; }
	.entrance-mobile-map > button.is-current { color: #ffe69d; background: #ffffff0a; }
	.entrance-info__photos { min-height: 250px; margin: 8px 0 20px; }
	.entrance-info__staff { margin-top: 4px; }
	.blackboard-v2-fit-stage { width: 100%; }
	.entrance-drum__face--beginner::before { margin-top: 24px; margin-bottom: -10px; font-size: 11px; }
	.supply-go-round.is-gear-repairing::after { right: 8px; top: 96px; width: 116px; height: 136px; }
}

@media (prefers-reduced-motion: reduce) {
	.entrance-mapbar,
	.entrance-mobile-map,
	.entrance-map-toggle i { transition: none !important; }
	.supply-go-round.is-gear-rattling .supply-carousel-stage { animation: none !important; }
}

/* v7.7.4 — PCのMAPは上端へ戻り、触れている間だけ全体を見せる。 */
@media (min-width: 761px) {
	.entrance-mapbar {
		transform: translate(-50%, calc(-100% + 10px));
	}
	.entrance-mapbar:is(.is-visible, :hover, :focus-within) {
		transform: translate(-50%, 0);
	}
}
