/**
 * iPad Pro frame adapted from Devices.css v0.2.0.
 * MIT License, Copyright (c) 2017 Yan Zhu.
 * https://github.com/picturepan2/devices.css
 */

.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__device {
	aspect-ratio: 560 / 778;
	--flashblocks-wsp-frame-edge: #bfc1c3;
	--flashblocks-wsp-frame-surface: #e2e3e4;
	container-type: inline-size;
	max-width: none;
	position: relative;
}

.flashblocks-wsp.has-frame-ipad-pro.has-frame-color-spacegray .flashblocks-wsp__device,
.flashblocks-wsp.has-frame-ipad-pro.has-frame-color-dark .flashblocks-wsp__device {
	--flashblocks-wsp-frame-edge: #6a6d70;
	--flashblocks-wsp-frame-surface: #83878a;
}

.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__device-frame {
	background: #0d0d0d;
	border-radius: 6.43% / 4.63%;
	box-shadow: inset 0 0 0 max(1px, 0.18cqw) var(--flashblocks-wsp-frame-edge), inset 0 0 max(1px, 0.18cqw) max(1px, 0.54cqw) var(--flashblocks-wsp-frame-surface);
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
}

.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__viewport {
	border: max(1px, 0.36cqw) solid #121212;
	border-radius: 2.17% / 1.52%;
	height: 93.059%;
	left: 4.821%;
	position: absolute;
	top: 3.47%;
	width: 90.357%;
	z-index: 3;
}

.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__content {
	background: var(--flashblocks-wsp-background-color, transparent);
}

.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__device-btns::after,
.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__device-btns::before {
	background: var(--flashblocks-wsp-frame-edge);
	content: "";
	position: absolute;
	z-index: 2;
}

.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__device-btns::after {
	height: max(1px, 0.36cqw);
	right: 7.143%;
	top: -0.257%;
	width: 6.429%;
}

.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__device-btns::before {
	box-shadow: 0 6.607cqw var(--flashblocks-wsp-frame-edge);
	height: 4.113%;
	right: -0.357%;
	top: 8.098%;
	width: max(1px, 0.36cqw);
}

.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__device-sensors::after,
.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__device-sensors::before {
	content: "";
	position: absolute;
	z-index: 4;
}

.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__device-sensors::after {
	background: #1a1a1a;
	border-radius: 50%;
	box-shadow: -3.571cqw 0 #1a1a1a, 12.5cqw 0 #1a1a1a;
	height: 1.285%;
	left: 50%;
	margin-left: -5.357%;
	top: 1.542%;
	width: 1.786%;
}

.flashblocks-wsp.has-frame-ipad-pro .flashblocks-wsp__device-sensors::before {
	background: radial-gradient(farthest-corner at 20% 20%, #6074bf 0, transparent 40%), radial-gradient(farthest-corner at 80% 80%, #513785 0, #24555e 20%, transparent 50%);
	border-radius: 50%;
	box-shadow: 0 0 max(1px, 0.18cqw) max(1px, 0.18cqw) rgba(255, 255, 255, 0.05);
	height: 0.771%;
	left: 50%;
	margin-left: -0.536%;
	top: 1.799%;
	width: 1.071%;
}
