/*
 * /new/ index page-specific rules only. All other layout (.page-head,
 * .result-line, .sale-section, .sale-grid, .sale-empty, the .work-card
 * grid itself) comes from assets/css/sale-index.css unmodified: this
 * page's wrapper carries the same "hd-sale-index" class that every one of
 * that file's selectors is scoped to (".hd-sale-index .xxx"), so that
 * styling applies here for free with zero duplication and zero risk to the
 * /sale/ page (sale-index.css is not edited by this feature).
 *
 * Scoped to .hd-new-recent-index (this page's second wrapper class) only,
 * so nothing here can affect any other page.
 */

/*
 * common-work-card.css's .work-card sets display:flex directly, which (at
 * equal selector specificity) takes precedence over the browser's own
 * [hidden]{display:none} rule -- this override restores [hidden]'s effect
 * for the "もっと見る" progressive reveal (assets/js/new-recent-index.js).
 */
.hd-new-recent-index .sale-grid .work-card[hidden] {
	display: none;
}

.hd-new-recent-index .new-recent-more-wrap {
	margin-top: 28px;
	padding: 0 28px 30px;
	text-align: center;
}

.hd-new-recent-index .new-recent-more {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 180px;
	padding: 12px 28px;
	border: 1px solid var(--hd-c-main);
	border-radius: 24px;
	background: var(--hd-c-main);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
}

.hd-new-recent-index .new-recent-more:hover {
	background: var(--hd-c-dark);
	border-color: var(--hd-c-dark);
}

.hd-new-recent-index .new-recent-more[hidden] {
	display: none;
}