/* Crossings 論文ノート — フロント表示
   テーマのフォント・配色をなるべく継承し、必要な部分だけ足す。 */

.cpn-card,
.cpn-list {
	--cpn-ink: currentColor;
	--cpn-line: rgba(0, 0, 0, .12);
	--cpn-soft: rgba(0, 0, 0, .04);
	--cpn-muted: rgba(0, 0, 0, .58);
	--cpn-accent: #2f6f6b;
	font-size: 1rem;
	line-height: 1.75;
}

@media (prefers-color-scheme: dark) {
	.cpn-card,
	.cpn-list {
		--cpn-line: rgba(255, 255, 255, .18);
		--cpn-soft: rgba(255, 255, 255, .06);
		--cpn-muted: rgba(255, 255, 255, .62);
		--cpn-accent: #7fc6c0;
	}
}

/* ---------- 書誌カード（単体ページ） ---------- */

.cpn-card {
	margin: 0 0 2.2em;
	padding: 1.1em 1.3em;
	border: 1px solid var(--cpn-line);
	border-left: 4px solid var(--cpn-accent);
	border-radius: 4px;
	background: var(--cpn-soft);
}

.cpn-card__summary {
	margin: 0 0 .9em;
	font-size: 1.05em;
	font-weight: 600;
	line-height: 1.7;
}

.cpn-card__meta {
	display: grid;
	grid-template-columns: 7em 1fr;
	gap: .25em .9em;
	margin: 0;
	font-size: .92em;
}

.cpn-card__meta dt {
	margin: 0;
	color: var(--cpn-muted);
	font-weight: 400;
}

.cpn-card__meta dd {
	margin: 0;
	word-break: break-word;
}

.cpn-card__chips {
	margin-top: 1em;
	padding-top: .8em;
	border-top: 1px dashed var(--cpn-line);
}

@media (max-width: 600px) {
	.cpn-card__meta {
		grid-template-columns: 1fr;
		gap: 0 0;
	}
	.cpn-card__meta dt {
		margin-top: .6em;
		font-size: .85em;
	}
}

/* ---------- チップ ---------- */

.cpn-chip {
	display: inline-block;
	margin: 0 .35em .35em 0;
	padding: .12em .7em;
	border: 1px solid var(--cpn-line);
	border-radius: 999px;
	font-size: .8em;
	line-height: 1.7;
	text-decoration: none;
	color: inherit;
	white-space: nowrap;
}

a.cpn-chip:hover {
	border-color: var(--cpn-accent);
	color: var(--cpn-accent);
}

.cpn-chip--stance,
.cpn-chip--rating {
	background: var(--cpn-soft);
	color: var(--cpn-muted);
}

.cpn-chip--pn_theme {
	border-color: var(--cpn-accent);
	color: var(--cpn-accent);
}

/* ---------- 絞り込みフォーム ---------- */

.cpn-filter {
	margin: 0 0 1.6em;
	padding: 1em 1.2em;
	border: 1px solid var(--cpn-line);
	border-radius: 4px;
	background: var(--cpn-soft);
}

.cpn-filter__row {
	display: flex;
	flex-wrap: wrap;
	gap: .8em 1em;
	align-items: flex-end;
}

.cpn-filter__field {
	display: flex;
	flex-direction: column;
	gap: .2em;
	flex: 0 1 auto;
	min-width: 8.5em;
}

.cpn-filter__field--wide {
	flex: 1 1 16em;
}

.cpn-filter__field > span {
	font-size: .78em;
	color: var(--cpn-muted);
	letter-spacing: .04em;
}

.cpn-filter input[type="search"],
.cpn-filter select {
	width: 100%;
	max-width: 100%;
	padding: .4em .6em;
	border: 1px solid var(--cpn-line);
	border-radius: 3px;
	background: transparent;
	color: inherit;
	font-size: .92em;
	font-family: inherit;
}

.cpn-filter__actions {
	display: flex;
	align-items: center;
	gap: .8em;
}

.cpn-filter button {
	padding: .45em 1.4em;
	border: 1px solid var(--cpn-accent);
	border-radius: 3px;
	background: var(--cpn-accent);
	color: #fff;
	font-size: .92em;
	font-family: inherit;
	cursor: pointer;
}

.cpn-filter button:hover {
	opacity: .88;
}

.cpn-filter__reset {
	font-size: .85em;
	color: var(--cpn-muted);
}

/* ---------- 一覧 ---------- */

.cpn-count {
	margin: 0 0 .8em;
	font-size: .85em;
	color: var(--cpn-muted);
}

.cpn-items {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--cpn-line);
}

.cpn-item {
	margin: 0;
	padding: 1.3em 0;
	border-bottom: 1px solid var(--cpn-line);
	list-style: none;
}

.cpn-item__title {
	margin: 0 0 .3em;
	font-size: 1.08em;
	line-height: 1.55;
	font-weight: 700;
}

.cpn-item__title a {
	text-decoration: none;
	color: inherit;
}

.cpn-item__title a:hover {
	color: var(--cpn-accent);
	text-decoration: underline;
}

.cpn-item__cite {
	margin: 0 0 .4em;
	font-size: .85em;
	color: var(--cpn-muted);
}

.cpn-item__summary {
	margin: 0 0 .6em;
	font-size: .95em;
	line-height: 1.75;
}

.cpn-item__tags {
	margin: 0;
	line-height: 1.9;
}

.cpn-empty {
	padding: 2em 0;
	color: var(--cpn-muted);
}

/* ---------- ページ送り ---------- */

.cpn-pagination {
	margin-top: 1.8em;
	font-size: .9em;
}

.cpn-pagination .page-numbers {
	display: inline-block;
	margin: 0 .2em;
	padding: .3em .8em;
	border: 1px solid var(--cpn-line);
	border-radius: 3px;
	text-decoration: none;
	color: inherit;
}

.cpn-pagination .page-numbers.current {
	background: var(--cpn-accent);
	border-color: var(--cpn-accent);
	color: #fff;
}