/**
 * Pye "Continental" TV skin.
 */

.retro-tv--pye {
	--wood-dark: #2a1410;
	--wood-mid: #4a2518;
	--wood-light: #6b3824;
	--gold: #c9a227;
	--gold-light: #e8c547;
	--gold-dark: #8a6914;
	--bezel: #ddd9d0;
	--bezel-shadow: #b8b4ab;

	position: relative;
	width: 100%;
	font-family: Georgia, "Times New Roman", serif;
	filter: drop-shadow(0 18px 28px rgba(0, 0, 0, 0.45));
}

.retro-tv--pye .retro-tv__cabinet {
	padding: 14px 16px 18px;
	border-radius: 28px 28px 22px 22px;
	background:
		repeating-linear-gradient(90deg, transparent 0, rgba(255, 255, 255, 0.03) 2px, transparent 4px),
		linear-gradient(180deg, var(--wood-light) 0%, var(--wood-mid) 18%, var(--wood-dark) 100%);
	box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.12), inset 0 -3px 8px rgba(0, 0, 0, 0.35), 0 4px 0 #1a0c08;
}

.retro-tv--pye .retro-tv__inset {
	padding: 10px;
	border-radius: 18px;
	background: linear-gradient(145deg, var(--gold-light), var(--gold) 40%, var(--gold-dark));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), inset 0 -2px 4px rgba(0, 0, 0, 0.25);
}

.retro-tv--pye .retro-tv__inset-inner {
	padding: 12px 14px 14px;
	border-radius: 12px;
	background: linear-gradient(180deg, var(--wood-mid), var(--wood-dark));
	box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.4);
}

.retro-tv--pye .retro-tv__screen-wrap {
	margin-bottom: 14px;
}

.retro-tv--pye .retro-tv__bezel {
	padding: 14px 16px;
	border-radius: 36px;
	background: linear-gradient(180deg, #eceae4 0%, var(--bezel) 30%, var(--bezel-shadow) 100%);
	box-shadow: inset 0 3px 6px rgba(255, 255, 255, 0.7), inset 0 -4px 8px rgba(0, 0, 0, 0.15);
}

.retro-tv--pye .retro-tv__screen {
	border-radius: 28px;
	box-shadow: inset 0 0 24px rgba(0, 0, 0, 0.18), inset 3px 3px 8px rgba(255, 255, 255, 0.2);
}

.retro-tv--pye .retro-tv__controls {
	display: grid;
	grid-template-columns: 1fr 1.1fr 1fr;
	align-items: center;
	gap: 8px;
	min-height: 88px;
}

.retro-tv--pye .retro-tv__knob {
	position: relative;
	width: 72px;
	height: 72px;
	margin: 0 auto;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #6b4030 0%, #3d2018 45%, #1a0c08 100%);
	box-shadow: inset 0 2px 4px rgba(255, 255, 255, 0.15), 0 0 0 3px var(--gold-dark);
}

.retro-tv--pye .retro-tv__knob::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 28px;
	height: 4px;
	margin: -2px 0 0 -14px;
	background: linear-gradient(90deg, var(--gold-dark), var(--gold-light), var(--gold-dark));
	border-radius: 2px;
	transform: rotate(-35deg);
}

.retro-tv--pye .retro-tv__knob-label {
	position: absolute;
	width: 100%;
	bottom: -16px;
	text-align: center;
	font-size: 7px;
	color: rgba(255, 255, 255, 0.55);
	text-transform: uppercase;
}

.retro-tv--pye .retro-tv__panel {
	height: 72px;
	border-radius: 6px;
	background: linear-gradient(180deg, var(--wood-light), var(--wood-mid) 50%, var(--wood-dark));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 2px 0 rgba(0, 0, 0, 0.25);
}

.retro-tv--pye .retro-tv__panel-handle {
	display: block;
	width: 36px;
	height: 6px;
	margin: 8px auto 4px;
	border-radius: 3px;
	background: linear-gradient(180deg, #d4d0c8, #8a8680);
}

.retro-tv--pye .retro-tv__brand-mark {
	display: block;
	width: 10px;
	height: 10px;
	margin: 0 auto 2px;
	border: 1.5px solid var(--gold);
	border-radius: 50%;
}

.retro-tv--pye .retro-tv__brand {
	display: block;
	text-align: center;
	font-size: 15px;
	font-style: italic;
	color: var(--gold-light);
	text-shadow: 0 1px 0 var(--gold-dark);
	margin-top: 6px;
}

.retro-tv--pye .retro-tv__base {
	height: 10px;
	margin: 0 24px;
	border-radius: 0 0 8px 8px;
	background: linear-gradient(180deg, #1a0c08, #0d0604);
}
