/* Cast & Schedule - front
   すべてのパーツは背景色・文字色を自分で持つ「カード」として作っています。
   テーマ側の背景が白でも黒でも、同じ見え方になります。 */

:root{
	--cs-bg:#ffffff;
	--cs-surface:#f7f5f2;
	--cs-text:#2a2a2a;
	--cs-muted:#8a8a8a;
	--cs-line:#e6e2dc;
	--cs-dark:#242424;
	--cs-gold:#b8925a;
	--cs-pink:#e8447b;
	--cs-new:#2e9b63;
}

.cs-single{
	color:inherit;
}
.cs-single *{ box-sizing:border-box; }

.cs-heading{
	margin:1.6em 0 .8em;
	padding-bottom:.4em;
	border-bottom:2px solid rgba(128,128,128,.35);
	font-size:1.1rem;
	color:inherit;
}
.cs-single > .cs-heading:first-child{ margin-top:0; }

/* ---------------- grid / cards（一覧・出勤表） ---------------- */

.cs-grid{
	display:grid;
	grid-template-columns:repeat(var(--cs-cols,3),1fr);
	gap:1.2em .8em;
	margin:1.5em 0;
}
@media (max-width:640px){
	.cs-grid{ grid-template-columns:repeat(2,1fr); }
}

.cs-card{
	background:var(--cs-bg);
	border-radius:8px;
	overflow:hidden;
	box-shadow:0 1px 6px rgba(0,0,0,.15);
}
.cs-card__link{
	display:block;
	text-decoration:none;
	color:var(--cs-text);
}
.cs-card__thumb{
	position:relative;
	aspect-ratio:3/4;
	overflow:hidden;
	background:var(--cs-surface);
}
.cs-card__thumb img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	transition:transform .4s ease;
}
.cs-card__link:hover .cs-card__thumb img{ transform:scale(1.04); }
.cs-card__noimg{
	display:flex;
	align-items:center;
	justify-content:center;
	height:100%;
	font-size:.75em;
	letter-spacing:.1em;
	color:var(--cs-muted);
}

.cs-badge{
	position:absolute;
	font-size:.7rem;
	line-height:1;
	padding:.35em .6em;
	border-radius:3px;
	color:#fff;
	letter-spacing:.02em;
}
.cs-badge--new{ top:6px; left:6px; background:var(--cs-gold); }
.cs-badge--pickup{ top:6px; right:6px; background:var(--cs-pink); }
.cs-badge--work{ bottom:0; left:0; right:0; border-radius:0; text-align:center; background:rgba(0,0,0,.7); padding:.45em .3em; }

.cs-card__body{
	padding:.7em .7em .8em !important;
	text-align:center;
}
.cs-card__name{
	margin:0 !important;
	padding:0 !important;
	font-size:1rem;
	line-height:1.4 !important;
	color:var(--cs-text);
}
.cs-card__age{ font-size:.8rem; font-weight:normal; opacity:.65; }
.cs-card__catch{
	margin:.25em 0 0 !important;
	padding:0 !important;
	font-size:.8rem;
	line-height:1.5 !important;
	color:var(--cs-muted);
}
.cs-card__sizes{
	margin:.25em 0 0 !important;
	padding:0 !important;
	font-size:.75rem;
	line-height:1.5 !important;
	color:var(--cs-gold);
}

/* ---------------- 出勤表タブ ---------------- */

.cs-schedule{ color:inherit; }

.cs-tabs{
	display:flex;
	gap:.3em;
	overflow-x:auto;
	padding-bottom:.4em;
	-webkit-overflow-scrolling:touch;
}
.cs-tab{
	flex:0 0 auto;
	padding:.5em 1em;
	border:1px solid currentColor;
	border-radius:999px;
	background:transparent;
	color:inherit;
	font-size:.85rem;
	cursor:pointer;
	opacity:.55;
}
.cs-tab.is-active{
	opacity:1;
	background:var(--cs-dark);
	border-color:var(--cs-dark);
	color:#fff;
}

.cs-panel{ display:none; margin-top:10px; }
.cs-panel.is-active{ display:block; }

.cs-empty{
	margin:2em 0;
	text-align:center;
	font-size:.9rem;
	opacity:.6;
}

/* ---------------- 詳細ページ：プロフィール表 ---------------- */

.cs-profile-table{ width:100%; border-collapse:collapse; margin:0 0 1em; font-size:.9rem; }
.cs-profile-table th,.cs-profile-table td{ padding:.7em .8em; border-bottom:1px solid rgba(128,128,128,.35); text-align:left; }
.cs-profile-table th{ width:30%; white-space:nowrap; opacity:.65; font-weight:normal; }
.cs-profile-table td{ color:inherit; }

/* ---------------- ホバー拡大ギャラリー ---------------- */

.cs-gallery{ margin:0 auto 1.5em; max-width:640px; }
.cs-gallery__main{
	position:relative;
	width:100%;
	aspect-ratio:3/4;
	background:#111;
	border-radius:6px;
	overflow:hidden;
	margin-bottom:.6em;
}
.cs-gallery__slides{
	position:relative;
	width:100%;
	height:100%;
}
.cs-gallery__slide{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
	background:#111;
	display:none;
}
.cs-gallery__slide.is-active{ display:block; }
.cs-gallery__nav{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	width:2.4em;
	height:2.4em;
	border:none;
	border-radius:50%;
	background:rgba(0,0,0,.45);
	color:#fff;
	font-size:1.4rem;
	line-height:1;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	z-index:2;
}
.cs-gallery__nav:hover{ background:rgba(0,0,0,.7); }
.cs-gallery__nav--prev{ left:.6em; }
.cs-gallery__nav--next{ right:.6em; }
.cs-gallery__thumbs{
	display:flex;
	justify-content:center;
	gap:.5em;
	list-style:none;
	margin:0;
	padding:0;
	flex-wrap:wrap;
}
.cs-gallery__thumb{
	width:72px;
	height:72px;
	border-radius:4px;
	overflow:hidden;
	cursor:pointer;
	opacity:.55;
	border:2px solid transparent;
	transition:opacity .15s ease, border-color .15s ease;
	flex:0 0 auto;
	background:var(--cs-surface);
}
.cs-gallery__thumb img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}
.cs-gallery__thumb:hover,
.cs-gallery__thumb.is-active{
	opacity:1;
	border-color:var(--cs-gold);
}
@media (max-width:480px){
	.cs-gallery__thumb{ width:60px; height:60px; }
}

/* ---------------- 詳細ページ：プロフィールヘッダー ---------------- */

.cs-header{ margin:0 0 1.2em !important; }
.cs-header__name{
	display:flex;
	flex-wrap:wrap;
	align-items:baseline;
	gap:.6em;
	margin:0 !important;
	padding:0 !important;
	font-size:1.5rem;
	line-height:1.3 !important;
	color:inherit;
}
.cs-header__age{ font-size:.85rem; font-weight:normal; opacity:.7; }
.cs-header__sizes{ font-size:.8rem; font-weight:normal; opacity:.6; }
.cs-header__catch{
	margin:.3em 0 0 !important;
	padding:0 !important;
	font-size:.85rem;
	letter-spacing:.08em;
	line-height:1.4 !important;
	color:var(--cs-gold);
}

.cs-header__badges{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:.5em;
	margin:.8em 0 0 !important;
}
.cs-tag{
	display:inline-block;
	padding:.4em .9em;
	border-radius:999px;
	font-size:.75rem;
	background:var(--cs-gold);
	color:#fff;
	white-space:nowrap;
}
.cs-tag--today{ background:var(--cs-dark); color:#fff; }
.cs-tag--new{ background:var(--cs-new); color:#fff; }
.cs-tag--join{ background:transparent; padding:.4em 0; color:var(--cs-muted); }

/* ---------------- 出勤予定・ご予約（縦型リスト） ---------------- */

.cs-resv{
	margin:0 0 1.5em;
}
.cs-resv__admin-hint{
	margin:0 0 .6em;
	padding:.6em .9em;
	border-radius:6px;
	background:#fff3cd;
	color:#7a5c00;
	font-size:.8rem;
}
.cs-resv-list{
	list-style:none !important;
	margin:0 !important;
	padding:0 !important;
	border:1px solid rgba(128,128,128,.3);
	border-radius:8px;
	overflow:hidden;
	background:var(--cs-bg);
}
.cs-resv-list__day{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:.5em 1em;
	margin:0 !important;
	padding:.7em .9em !important;
	border-bottom:1px solid rgba(128,128,128,.2);
	list-style:none !important;
	font-size:.85rem;
}
.cs-resv-list__day:last-child{ border-bottom:none; }
.cs-resv-list__day:first-child{
	background:var(--cs-dark);
	color:#fff;
}
.cs-resv-list__label{
	flex:0 0 56px;
	font-weight:bold;
}
.cs-resv-list__time{
	flex:1 1 120px;
}
.cs-resv-list__actions{
	flex:0 0 auto;
	display:flex;
	align-items:center;
	gap:.4em;
	margin-left:auto;
}
.cs-resv-list__slot{
	padding:.45em .5em;
	border-radius:4px;
	border:1px solid rgba(128,128,128,.4);
	background:var(--cs-bg);
	color:inherit;
	font-size:.8rem;
}
@media (max-width:420px){
	.cs-resv-list__day{ padding:.6em .7em !important; }
	.cs-resv-list__actions{
		flex-basis:100%;
		margin-left:0;
		flex-wrap:wrap;
	}
	.cs-resv-list__slot{ flex:1 1 auto; }
}
.cs-btn{
	display:inline-block;
	padding:.5em 1em;
	border-radius:4px;
	font-size:.8rem;
	text-decoration:none;
	white-space:nowrap;
	box-sizing:border-box;
}
.cs-btn--tel{ background:var(--cs-surface); color:var(--cs-text); border:1px solid var(--cs-line); }
.cs-btn--web{ background:var(--cs-pink); color:#fff; }
.cs-btn--web:hover{ background:#d13068; }

/* ---------------- 基本プレイ・オプションプレイ ---------------- */

.cs-play-list{
	list-style:none !important;
	margin:0 0 1.5em !important;
	padding:0 !important;
	display:grid;
	grid-template-columns:repeat(auto-fill, minmax(160px,1fr));
	gap:.5em .8em;
}
.cs-play-list li{
	margin:0 !important;
	padding:0 !important;
	list-style:none !important;
}
.cs-play-list__item{
	display:flex;
	align-items:center;
	gap:.5em;
	padding:.5em .7em;
	border-radius:6px;
	background:var(--cs-surface);
	font-size:.85rem;
}
.cs-play-list li.is-ng .cs-play-list__item{ opacity:.45; }
.cs-play-list__mark{
	flex:0 0 auto;
	width:1.4em;
	height:1.4em;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:50%;
	font-size:.85rem;
	font-weight:bold;
	color:#fff;
}
.is-ok .cs-play-list__mark{ background:var(--cs-pink); }
.is-ng .cs-play-list__mark{ background:#999; }
.cs-play-list__name{ flex:1 1 auto; }
.cs-play-list__price{
	flex:0 0 auto;
	font-size:.75rem;
	color:var(--cs-gold);
	white-space:nowrap;
}

/* ---------------- メッセージ ---------------- */

.cs-message{
	margin:0 0 1.5em !important;
	padding:1em 1.2em !important;
	border:none !important;
	border-radius:6px;
	background:#f2f2f2;
	font-size:.9rem;
	line-height:1.8;
}
.cs-message p{ margin:0 0 .6em !important; }
.cs-message p:last-child{ margin-bottom:0 !important; }

/* ---------------- ページャー ---------------- */

.cs-pager{
	margin:1.5em 0 0;
}
.cs-pager ul{
	list-style:none !important;
	margin:0 !important;
	padding:0 !important;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:.4em;
}
.cs-pager li{
	margin:0 !important;
	padding:0 !important;
	list-style:none !important;
}
.cs-pager .page-numbers{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:2.2em;
	height:2.2em;
	padding:0 .6em;
	border-radius:6px;
	border:1px solid rgba(128,128,128,.3);
	text-decoration:none;
	font-size:.85rem;
	color:inherit;
}
.cs-pager .page-numbers.current{
	background:var(--cs-dark);
	border-color:var(--cs-dark);
	color:#fff;
}
.cs-pager .page-numbers.dots{
	border:none;
}

/* ---------------- アーカイブページ（在籍一覧・タイプ別） ---------------- */

.cs-archive-wrap{
	max-width:1200px;
	margin:0 auto;
	padding:2em 1em;
}
.cs-archive-title{
	margin:0 0 1em !important;
	font-size:1.4rem;
	text-align:center;
}

/* ---------------- 日記 ---------------- */

.cs-diary-grid{
	display:grid;
	grid-template-columns:repeat(auto-fill, minmax(150px,1fr));
	gap:1em .8em;
	margin:1em 0;
}
.cs-diary-card{
	display:block;
	text-decoration:none;
	color:inherit;
	background:var(--cs-bg);
	border-radius:8px;
	overflow:hidden;
	box-shadow:0 1px 6px rgba(0,0,0,.15);
}
.cs-diary-card__thumb{
	aspect-ratio:1/1;
	background:var(--cs-surface);
	overflow:hidden;
}
.cs-diary-card__thumb img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}
.cs-diary-card__body{ padding:.6em .7em; }
.cs-diary-card__date{
	display:block;
	font-size:.7rem;
	color:var(--cs-gold);
	margin-bottom:.3em;
}
.cs-diary-card__excerpt{
	margin:0;
	font-size:.78rem;
	line-height:1.5;
	color:var(--cs-text);
}
.cs-diary-more{ text-align:center; margin:1em 0 0; }
.cs-diary-more a{ font-size:.85rem; }
.cs-diary-back,
.cs-diary-backlink{ margin:1.5em 0; text-align:center; }