/* Manifesto page — "Buradan Biri Geçti". Uses the theme's tokens only. */

.cr-mf {
	--mf-measure: 68ch;
	--mf-aside: 320px;
	--mf-gap: clamp(48px, 5vw, 80px);
	padding-block: clamp(48px, 7vw, 96px) clamp(72px, 9vw, 128px);
}
.cr-mf__layout {
	max-width: calc(var(--mf-measure) + var(--mf-gap) + var(--mf-aside) + 2 * var(--cr-gutter));
	margin-inline: auto;
	padding-inline: var(--cr-gutter);
}
.cr-mf__article { max-width: var(--mf-measure); margin-inline: auto; }

/* Opening */
.cr-mf__head { margin-bottom: clamp(36px, 5vw, 56px); }
.cr-mf__title {
	font-family: var(--cr-serif);
	font-size: clamp(34px, 4.4vw, 58px);
	line-height: 1.08;
	letter-spacing: .035em;
	margin: 0 0 18px;
	text-wrap: balance;
}
.cr-mf__subtitle {
	font-family: var(--cr-serif);
	font-size: clamp(20px, 2vw, 24px);
	line-height: 1.35;
	color: var(--body);
	margin: 0 0 22px;
}
.cr-mf__byline {
	font-family: var(--cr-sans);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .04em;
	color: var(--muted);
	margin: 0;
	display: flex;
	align-items: center;
	gap: 14px;
}
/* A single hairline with a small break: the only reference to fractured glass. */
.cr-mf__byline::before {
	content: "";
	width: 56px;
	height: 1px;
	background:
		linear-gradient(var(--line2), var(--line2)) 0 0 / 24px 1px no-repeat,
		linear-gradient(var(--line2), var(--line2)) 27px 0 / 29px 1px no-repeat;
	transform: skewY(-8deg);
	flex: none;
}

/* Listening invitation (interface, not part of the text) */
.cr-mf__invite {
	display: flex;
	align-items: center;
	gap: 16px 24px;
	flex-wrap: wrap;
	padding: 16px 0;
	margin: 0 0 clamp(36px, 5vw, 52px);
	border-block: 1px solid var(--line);
	font-family: var(--cr-sans);
	font-size: 15px;
	line-height: 1.6;
	color: var(--muted);
}
.cr-mf__invite p { margin: 0; flex: 1 1 280px; }

/* The text */
.cr-mf__text {
	font-family: var(--cr-sans);
	font-size: clamp(17px, 1.25vw, 19px);
	line-height: 1.82;
	color: var(--body);
	hanging-punctuation: first;
	overflow-wrap: break-word;
}
.cr-mf__text p { margin: 0 0 1.2em; }
.cr-mf__text strong { color: var(--fg); font-weight: 600; }
.cr-mf__text em { font-style: italic; }
.cr-mf__sign { margin-top: 2.6em !important; line-height: 1.6; }
.cr-mf__sign em { color: var(--muted); font-style: normal; letter-spacing: .14em; font-size: .78em; }

/* Invitation button (same audio as the player) */
.cr-mf__btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 40px;
	padding: 0 18px 0 6px;
	border: 1px solid var(--line2);
	border-radius: 999px;
	background: transparent;
	color: var(--fg);
	font: 600 13px/1 var(--cr-sans);
	letter-spacing: .06em;
	cursor: pointer;
	transition: border-color .25s;
	flex: none;
}
[dir="rtl"] .cr-mf__btn { padding: 0 6px 0 18px; }
.cr-mf__btn:hover { border-color: var(--fg); }
.cr-mf__dot { width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--line2); display: inline-flex; align-items: center; justify-content: center; }
.cr-mf__i { flex: none; display: block; }
.cr-mf__i--pause, .is-playing .cr-mf__i--play { display: none; }
.is-playing .cr-mf__i--pause { display: block; }
.cr-mf__credit { margin: 0; font-family: var(--cr-sans); font-size: 11.5px; line-height: 1.55; color: var(--muted); }
.cr-mf__credit a { color: var(--muted); white-space: nowrap; }
.cr-mf__credit a:hover { color: var(--fg); }
.cr-mf__credit--inline { display: none; flex-basis: 100%; }

/* The player: one small object, no panel */
.cr-mf__player {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	grid-template-areas: "play meta" "tools tools";
	align-items: center;
	gap: 14px 16px;
	font-family: var(--cr-sans);
}
.cr-mf__round {
	grid-area: play;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 1px solid var(--line2);
	background: transparent;
	color: var(--fg);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: border-color .25s, background-color .25s, color .25s;
}
.cr-mf__round:hover { border-color: var(--fg); }
.is-playing .cr-mf__round { background: var(--fg); color: var(--bg); border-color: var(--fg); }
.cr-mf__meta { grid-area: meta; min-width: 0; }
.cr-mf__label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0 0 3px; font-size: 10.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--fg); }
.cr-mf__sub { margin: 0; font-family: var(--cr-serif); font-size: 16px; line-height: 1.3; color: var(--muted); }
.cr-mf__progress { position: relative; height: 1px; margin-top: 12px; background: var(--line); overflow: hidden; }
.cr-mf__progress span { position: absolute; inset-block: 0; inset-inline-start: 0; width: 100%; background: var(--fg); transform: scaleX(var(--p, 0)); transform-origin: left center; }
[dir="rtl"] .cr-mf__progress span { transform-origin: right center; }
.cr-mf__tools { grid-area: tools; display: flex; align-items: center; gap: 10px; padding-inline-start: 60px; }
.cr-mf__vol { display: flex; align-items: center; gap: 8px; color: var(--muted); flex: 0 1 140px; min-width: 0; }
.cr-mf__vol input { width: 100%; min-width: 60px; accent-color: var(--fg); height: 20px; margin: 0; cursor: pointer; }
.cr-mf__loop {
	width: 34px;
	height: 34px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid transparent;
	border-radius: 50%;
	background: transparent;
	color: var(--muted);
	cursor: pointer;
	flex: none;
}
.cr-mf__loop:hover { color: var(--fg); }
.cr-mf__loop[aria-pressed="true"] { color: var(--fg); border-color: var(--line2); }
.cr-mf__status { margin: 10px 0 0; font-family: var(--cr-sans); font-size: 12.5px; color: var(--muted); }
.cr-mf__status:empty { display: none; }
.cr-mf__music > .cr-mf__credit { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }

/* Desktop: reading column + the player beside it, following the reader */
@media (min-width: 1180px) {
	.cr-mf__layout {
		display: grid;
		grid-template-columns: minmax(0, var(--mf-measure)) var(--mf-aside);
		column-gap: var(--mf-gap);
		justify-content: center;
		align-items: start;
	}
	.cr-mf__article { margin-inline: 0; }
	.cr-mf__music { position: sticky; top: calc(var(--cr-header-h) + 40px); padding-top: 8px; }
	.admin-bar .cr-mf__music { top: calc(var(--cr-header-h) + 72px); }
}

/* Tablet & phone: a small bar at the bottom edge */
@media (max-width: 1179.98px) {
	.cr-mf { --mf-aside: auto; }
	.cr-mf__music {
		box-sizing: border-box;
		position: fixed;
		z-index: 9970;
		inset-inline-end: 12px;
		bottom: calc(12px + env(safe-area-inset-bottom, 0px));
		width: min(340px, calc(100% - 24px));
		padding: 8px 10px 8px 8px;
		border: 1px solid var(--line2);
		border-radius: 999px;
		background: var(--elev);
		box-shadow: var(--cr-shadow);
		transition: bottom .25s var(--cr-ease);
	}
	[dir="rtl"] .cr-mf__music { padding: 8px 8px 8px 10px; }
	.cr-mf__player { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "play meta tools"; gap: 12px; }
	.cr-mf__round { width: 40px; height: 40px; }
	.cr-mf__sub, .cr-mf__music > .cr-mf__credit { display: none; }
	.cr-mf__progress { margin-top: 8px; }
	.cr-mf__tools { padding: 0; gap: 4px; }
	.cr-mf__vol { flex: 0 0 auto; }
	.cr-mf__vol input { width: 64px; }
	.cr-mf__status { position: absolute; bottom: calc(100% + 8px); inset-inline: 0; margin: 0; padding: 8px 12px; border-radius: 12px; background: var(--elev); border: 1px solid var(--line2); }
	.cr-mf__credit--inline { display: block; }
	.cr-mf { padding-bottom: 120px; }
}
@media (max-width: 600px) {
	.cr-mf { padding-block: 40px 120px; }
	.cr-mf__title { letter-spacing: .02em; }
	.cr-mf__invite { font-size: 14px; }
	.cr-mf__label { letter-spacing: .14em; }
}
/* Small phones: the phone's own volume buttons; the bar keeps only play, title and repeat. */
@media (max-width: 480px) {
	.cr-mf__vol { display: none; }
}
/* Browsers that do not let a page set the volume (iPhone/iPad): the device buttons do it. */
.cr-mf.no-volume .cr-mf__vol { display: none; }

/* Arabic: natural line height, no letter-spacing on the title, no italics */
.cr-mf[dir="rtl"] .cr-mf__title { letter-spacing: 0; line-height: 1.4; font-family: "Amiri", var(--cr-serif); }
.cr-mf[dir="rtl"] .cr-mf__subtitle { font-family: "Amiri", var(--cr-serif); }
.cr-mf[dir="rtl"] .cr-mf__text { line-height: 2; font-size: clamp(18px, 1.3vw, 20px); hanging-punctuation: none; }
.cr-mf[dir="rtl"] .cr-mf__text em, .cr-mf[dir="rtl"] .cr-mf__subtitle em { font-style: normal; }
.cr-mf[dir="rtl"] .cr-mf__text em { color: var(--fg); }
.cr-mf[dir="rtl"] .cr-mf__byline::before { transform: skewY(8deg); }

@media print {
	.cr-mf__music, .cr-mf__invite { display: none !important; }
}
