:root {
	--tabino-ink: #25313c;
	--tabino-muted: #66727d;
	--tabino-line: #e8e3df;
	--tabino-paper: #fffdf9;
	--tabino-pink: #ef7f91;
	--tabino-pink-soft: #fff0f3;
	--tabino-blue: #6ba9c8;
	--tabino-blue-soft: #edf8fc;
	--tabino-yellow: #f6d77c;
	--tabino-shadow: 0 14px 36px rgba(48, 58, 67, 0.08);
}

.tabino-archive {
	background:
		radial-gradient(circle at 10% 0%, rgba(239, 127, 145, 0.08), transparent 30%),
		radial-gradient(circle at 92% 12%, rgba(107, 169, 200, 0.10), transparent 28%),
		#fff;
	color: var(--tabino-ink);
	padding: 36px 16px 80px;
}

.tabino-archive *,
.tabino-archive *::before,
.tabino-archive *::after {
	box-sizing: border-box;
}

.tabino-archive__inner {
	width: min(1120px, 100%);
	margin: 0 auto;
}

.tabino-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr);
	gap: 34px;
	align-items: center;
	overflow: hidden;
	position: relative;
	padding: clamp(32px, 5vw, 64px);
	border: 1px solid var(--tabino-line);
	border-radius: 32px;
	background:
		linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,248,244,.94)),
		var(--tabino-paper);
	box-shadow: var(--tabino-shadow);
}

.tabino-kicker,
.tabino-section__eyebrow {
	margin: 0 0 10px;
	color: var(--tabino-pink);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.tabino-hero h1 {
	margin: 0;
	font-size: clamp(34px, 5.7vw, 64px);
	line-height: 1.13;
	letter-spacing: .01em;
}

.tabino-hero__lead {
	max-width: 720px;
	margin: 22px 0 0;
	color: var(--tabino-muted);
	font-size: clamp(15px, 1.7vw, 18px);
	line-height: 1.95;
}

.tabino-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 28px;
}

.tabino-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 11px 20px;
	border-radius: 999px;
	text-decoration: none !important;
	font-size: 14px;
	font-weight: 800;
	transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.tabino-button:hover {
	transform: translateY(-2px);
}

.tabino-button--primary {
	background: var(--tabino-ink);
	color: #fff !important;
	box-shadow: 0 8px 22px rgba(37, 49, 60, .16);
}

.tabino-button--secondary {
	border: 1px solid var(--tabino-line);
	background: #fff;
	color: var(--tabino-ink) !important;
}

.tabino-hero__visual {
	overflow: hidden;
	position: relative;
	border-radius: 28px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(48, 58, 67, 0.06);
}

.tabino-hero__character {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 28px;
}

.tabino-section {
	margin-top: 72px;
}

.tabino-section__heading {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 24px;
}

.tabino-section__heading h2,
.tabino-guide h2 {
	margin: 0;
	font-size: clamp(25px, 3vw, 36px);
	line-height: 1.3;
}

.tabino-section__note {
	margin: 0;
	color: var(--tabino-muted);
	font-size: 13px;
}

.tabino-card-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
}

.tabino-card {
	overflow: hidden;
	border: 1px solid var(--tabino-line);
	border-radius: 22px;
	background: #fff;
	box-shadow: 0 10px 28px rgba(48, 58, 67, .055);
	transition: transform .18s ease, box-shadow .18s ease;
}

.tabino-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(48, 58, 67, .10);
}

.tabino-card__link {
	display: block;
	height: 100%;
	color: inherit !important;
	text-decoration: none !important;
}

.tabino-card__image {
	aspect-ratio: 1 / 1;
	overflow: hidden;
	position: relative;
	background: #f6f4f2;
}

.tabino-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tabino-card__placeholder {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	background: linear-gradient(145deg, var(--tabino-pink-soft), var(--tabino-blue-soft));
	color: var(--tabino-ink);
	font-size: 24px;
	font-weight: 800;
}

.tabino-card__episode {
	position: absolute;
	left: 12px;
	top: 12px;
	padding: 6px 10px;
	border-radius: 999px;
	background: rgba(255,255,255,.94);
	color: var(--tabino-ink);
	font-size: 12px;
	font-weight: 800;
	box-shadow: 0 4px 14px rgba(37,49,60,.10);
}

.tabino-card__body {
	padding: 18px 18px 20px;
}

.tabino-card__series {
	margin: 0 0 7px;
	color: var(--tabino-pink);
	font-size: 12px;
	font-weight: 800;
}

.tabino-card__title {
	margin: 0;
	font-size: 18px;
	line-height: 1.5;
}

.tabino-card__excerpt {
	margin: 10px 0 0;
	color: var(--tabino-muted);
	font-size: 13px;
	line-height: 1.75;
}

.tabino-card__more,
.tabino-series-card__more {
	display: inline-block;
	margin-top: 15px;
	color: var(--tabino-blue);
	font-size: 13px;
	font-weight: 800;
}

.tabino-section--series {
	scroll-margin-top: 30px;
}

.tabino-series-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.tabino-series-card {
	display: grid;
	grid-template-columns: 150px minmax(0, 1fr);
	overflow: hidden;
	border: 1px solid var(--tabino-line);
	border-radius: 22px;
	background: var(--tabino-paper);
	color: inherit !important;
	text-decoration: none !important;
	transition: transform .18s ease, box-shadow .18s ease;
}

.tabino-series-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--tabino-shadow);
}

.tabino-series-card__image {
	aspect-ratio: 1 / 1;
	background: linear-gradient(145deg, var(--tabino-pink-soft), var(--tabino-blue-soft));
}

.tabino-series-card__image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.tabino-series-card__placeholder {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	color: var(--tabino-blue);
	font-size: 42px;
}

.tabino-series-card__body {
	padding: 18px 20px;
	align-self: center;
}

.tabino-series-card__code {
	display: inline-block;
	margin-bottom: 6px;
	color: var(--tabino-pink);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .08em;
}

.tabino-series-card h3 {
	margin: 0;
	font-size: 20px;
	line-height: 1.4;
}

.tabino-series-card p {
	margin: 7px 0 0;
	color: var(--tabino-muted);
	font-size: 13px;
}

.tabino-guide {
	display: grid;
	grid-template-columns: 110px minmax(0, 1fr);
	gap: 26px;
	align-items: center;
	margin-top: 72px;
	padding: 30px;
	border-radius: 26px;
	background: var(--tabino-blue-soft);
}

.tabino-guide__icon {
	display: grid;
	place-items: center;
	width: 96px;
	height: 96px;
	border-radius: 50%;
	background: #fff;
	font-size: 43px;
}

.tabino-guide p {
	margin: 13px 0 0;
	color: var(--tabino-muted);
	line-height: 1.9;
}

.tabino-text-link {
	display: inline-block;
	margin-top: 15px;
	color: var(--tabino-ink) !important;
	font-weight: 800;
	text-decoration: underline;
	text-underline-offset: 4px;
}

.tabino-site-link {
	margin-top: 34px;
	padding: 20px 24px;
	border: 1px dashed #d9d3cd;
	border-radius: 18px;
	text-align: center;
	background: #fff;
}

.tabino-site-link p {
	margin: 0 0 7px;
	color: var(--tabino-muted);
	font-size: 13px;
}

.tabino-site-link a {
	color: var(--tabino-ink);
	font-weight: 800;
}

.tabino-empty {
	margin-top: 50px;
	padding: 38px 24px;
	border: 1px dashed var(--tabino-line);
	border-radius: 20px;
	text-align: center;
	background: var(--tabino-paper);
}

.tabino-empty h2 {
	margin: 0 0 8px;
	font-size: 24px;
}

.tabino-empty p {
	margin: 0;
	color: var(--tabino-muted);
}

.tabino-empty--small {
	margin-top: 0;
	padding: 24px;
}

@media (max-width: 900px) {
	.tabino-hero {
		grid-template-columns: 1fr;
	}


	.tabino-card-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tabino-series-grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 620px) {
	.tabino-archive {
		padding: 18px 12px 56px;
	}

	.tabino-hero {
		padding: 28px 20px;
		border-radius: 24px;
	}

	.tabino-hero h1 {
		font-size: 36px;
	}

	.tabino-hero__lead {
		line-height: 1.8;
	}

	.tabino-hero__actions {
		flex-direction: column;
	}

	.tabino-button {
		width: 100%;
	}

	.tabino-section {
		margin-top: 54px;
	}

	.tabino-section__heading {
		align-items: flex-start;
		flex-direction: column;
		gap: 7px;
	}

	.tabino-card-grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.tabino-card {
		border-radius: 18px;
	}

	.tabino-series-card {
		grid-template-columns: 112px minmax(0, 1fr);
	}

	.tabino-series-card__body {
		padding: 15px;
	}

	.tabino-series-card h3 {
		font-size: 17px;
	}

	.tabino-guide {
		grid-template-columns: 1fr;
		padding: 24px 20px;
	}

	.tabino-guide__icon {
		width: 74px;
		height: 74px;
		font-size: 34px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tabino-card,
	.tabino-series-card,
	.tabino-button {
		transition: none;
	}
}

/* v1.6.0: 全話・カテゴリ一覧の並び替え */
.tabino-sort {
  display: flex;
  gap: 10px;
  margin: 0 0 24px;
  flex-wrap: wrap;
}
.tabino-sort__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 112px;
  padding: 10px 18px;
  border: 1px solid #d9dee3;
  border-radius: 999px;
  background: #fff;
  color: #5d6872;
  font-weight: 700;
  text-decoration: none;
}
.tabino-sort__button.is-active {
  background: #eef8fb;
  border-color: #78bed3;
  color: #277e99;
}
.tabino-sort__button:hover,
.tabino-sort__button:focus {
  text-decoration: none;
  border-color: #78bed3;
}

/* v1.7.0: 10話ずつ表示・上下ページネーション */
.tabino-more-episodes {
  margin-top: 28px;
  text-align: center;
}
.tabino-more-episodes .tabino-button {
  min-width: min(360px, 100%);
}
.tabino-more-episodes p,
.tabino-list-status {
  color: var(--tabino-muted);
  font-size: 13px;
}
.tabino-more-episodes p {
  margin: 10px 0 0;
}
.tabino-list-status {
  margin: 0 0 14px;
  font-weight: 700;
}
.tabino-pagination {
  margin: 18px 0 26px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.tabino-pagination .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.tabino-pagination .page-numbers li {
  margin: 0;
  padding: 0;
}
.tabino-pagination a.page-numbers,
.tabino-pagination span.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid #d9dee3;
  border-radius: 999px;
  background: #fff;
  color: var(--tabino-ink);
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  text-decoration: none !important;
}
.tabino-pagination span.page-numbers.current {
  border-color: #78bed3;
  background: #eef8fb;
  color: #277e99;
}
.tabino-pagination span.page-numbers.dots {
  min-width: 28px;
  padding-left: 4px;
  padding-right: 4px;
  border-color: transparent;
  background: transparent;
}
.tabino-back-to-top-list {
  margin-top: 24px;
  text-align: center;
}
.tabino-back-to-top-list a {
  color: var(--tabino-blue);
  font-weight: 800;
}

/* カテゴリ一覧（taxonomy）でも同じカードUIを使用 */
.tabino-series-page {
  background: #fff;
  color: var(--tabino-ink);
  padding: 28px 16px 72px;
}
.tabino-series-page *,
.tabino-series-page *::before,
.tabino-series-page *::after {
  box-sizing: border-box;
}
.tabino-series-page__inner {
  width: min(1120px, 100%);
  margin: 0 auto;
}
.tabino-series-page__header {
  margin: 42px 0 26px;
}
.tabino-series-page__eyebrow {
  margin: 0 0 8px;
  color: var(--tabino-pink);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
}
.tabino-series-page__header h1 {
  margin: 0;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.3;
}
.tabino-series-page__lead,
.tabino-series-page__description {
  margin-top: 12px;
  color: var(--tabino-muted);
  line-height: 1.8;
}
.tabino-series-episode-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}
.tabino-series-episode-card {
  overflow: hidden;
  border: 1px solid var(--tabino-line);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(48,58,67,.055);
}
.tabino-series-episode-card__link {
  display: block;
  height: 100%;
  color: inherit !important;
  text-decoration: none !important;
}
.tabino-series-episode-card__image {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  background: #f6f4f2;
}
.tabino-series-episode-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tabino-series-episode-card__placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  background: linear-gradient(145deg, var(--tabino-pink-soft), var(--tabino-blue-soft));
  font-weight: 800;
}
.tabino-series-episode-card__episode {
  position: absolute;
  top: 12px;
  left: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.94);
  color: var(--tabino-ink);
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 4px 14px rgba(37,49,60,.10);
}
.tabino-series-episode-card__body {
  padding: 18px 18px 20px;
}
.tabino-series-episode-card__body h2 {
  margin: 0;
  font-size: 18px;
  line-height: 1.5;
}
.tabino-series-episode-card__body p {
  margin: 10px 0 0;
  color: var(--tabino-muted);
  font-size: 13px;
  line-height: 1.75;
}
.tabino-series-episode-card__more {
  display: inline-block;
  margin-top: 15px;
  color: var(--tabino-blue);
  font-size: 13px;
  font-weight: 800;
}
.tabino-series-page__back {
  margin-top: 34px;
  text-align: center;
}
.tabino-series-page__back a {
  color: var(--tabino-ink);
  font-weight: 800;
}

@media (max-width: 900px) {
  .tabino-series-episode-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 620px) {
  .tabino-series-page {
    padding: 18px 12px 56px;
  }
  .tabino-series-episode-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .tabino-pagination .page-numbers {
    gap: 6px;
  }
  .tabino-pagination a.page-numbers,
  .tabino-pagination span.page-numbers {
    min-width: 38px;
    min-height: 38px;
    padding: 7px 10px;
    font-size: 12px;
  }
}

/* v1.7.1 カテゴリ別話一覧 */
.tabino-category-list__back {
  margin: 0 0 18px;
}

.tabino-category-list__back a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
  text-decoration: none;
}

.tabino-category-list__back a:hover,
.tabino-category-list__back a:focus {
  text-decoration: underline;
}