iobroker.jetframe 1.0.0

package/admin/jetframe.css.bak-nuke-airbus-align

@@ -0,0 +1,4790 @@
+/* ==================================================
+   JetFrame Unified Clean CSS
+================================================== */
+
+:root {
+	--bg: #05060a;
+	--muted: rgba(255,255,255,.62);
+	--green: #35e66b;
+	--blue: #56a8ff;
+	--yellow: #ffd84d;
+	--red: #ff5a5a;
+}
+
+* {
+	box-sizing: border-box;
+	-webkit-tap-highlight-color: transparent;
+}
+
+html,
+body {
+	margin: 0;
+	width: 100%;
+	height: 100%;
+	min-height: 100dvh;
+	overflow: hidden;
+	background: var(--bg);
+	color: white;
+	font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", Arial, sans-serif;
+}
+
+html,
+body{
+	touch-action:pan-x pan-y;
+	overscroll-behavior:none;
+}
+
+body {
+	background:
+		radial-gradient(circle at 18% 8%, rgba(70,110,180,.38), transparent 38%),
+		radial-gradient(circle at 85% 22%, rgba(255,150,60,.18), transparent 34%),
+		linear-gradient(145deg, #090b11, #020306 72%);
+}
+
+#app {
+	width: 100vw;
+	height: 100dvh;
+	padding:
+		calc(10px + env(safe-area-inset-top))
+		calc(10px + env(safe-area-inset-right))
+		calc(10px + env(safe-area-inset-bottom))
+		calc(10px + env(safe-area-inset-left));
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	overflow: hidden;
+}
+
+.card,
+.wall,
+.jf-shell {
+	width: min(1280px, 96vw);
+	height: min(820px, calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 20px));
+	border-radius: 32px;
+	padding: 16px;
+	background: linear-gradient(145deg, rgba(62,70,90,.58), rgba(18,18,20,.80));
+	border: 1px solid rgba(255,255,255,.18);
+	box-shadow:
+		0 35px 100px rgba(0,0,0,.58),
+		inset 0 1px 0 rgba(255,255,255,.22);
+	backdrop-filter: blur(24px);
+	-webkit-backdrop-filter: blur(24px);
+	overflow: hidden;
+	position: relative;
+}
+
+@media (orientation: portrait) {
+	.card,
+	.wall,
+	.jf-shell {
+		width: 96vw;
+		height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 20px);
+		border-radius: 30px;
+	}
+}
+
+/* ==================================================
+   Common
+================================================== */
+
+.backBtn {
+	position: fixed;
+	top: calc(env(safe-area-inset-top) + 10px);
+	left: calc(env(safe-area-inset-left) + 10px);
+	width: 34px;
+	height: 34px;
+	border-radius: 999px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	background: rgba(0,0,0,.22);
+	backdrop-filter: blur(16px);
+	-webkit-backdrop-filter: blur(16px);
+	border: 1px solid rgba(255,255,255,.10);
+	color: rgba(255,255,255,.86);
+	font-size: 24px;
+	font-weight: 900;
+	text-decoration: none;
+	z-index: 9999;
+	opacity: .72;
+}
+
+.simpleApiWarning {
+	position: fixed;
+	left: 50%;
+	bottom: calc(env(safe-area-inset-bottom) + 18px);
+	transform: translateX(-50%) translateY(12px);
+	z-index: 99999;
+	max-width: min(92vw, 560px);
+	padding: 12px 16px;
+	border-radius: 18px;
+	background: rgba(255,90,90,.18);
+	border: 1px solid rgba(255,90,90,.34);
+	color: rgba(255,235,235,.96);
+	box-shadow: 0 18px 50px rgba(0,0,0,.45);
+	backdrop-filter: blur(18px);
+	-webkit-backdrop-filter: blur(18px);
+	font-size: 14px;
+	font-weight: 800;
+	line-height: 1.25;
+	text-align: center;
+	opacity: 0;
+	pointer-events: none;
+	transition: opacity .25s ease, transform .25s ease;
+}
+
+.simpleApiWarning.visible {
+	opacity: 1;
+	transform: translateX(-50%) translateY(0);
+}
+
+/* ==================================================
+   Frame / Live
+================================================== */
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+/* ==================================================
+   Heatmap
+================================================== */
+
+body.jf-page-heatmap .jf-shell {
+	display: grid;
+	grid-template-rows: auto auto auto minmax(0, 1fr) 160px;
+	gap: 9px;
+}
+
+body.jf-page-heatmap .header {
+	display: grid;
+	grid-template-columns: minmax(0,1fr) auto;
+	align-items: center;
+	gap: 12px;
+}
+
+body.jf-page-heatmap .title {
+	font-size: clamp(25px, 5vw, 42px);
+	font-weight: 950;
+	letter-spacing: -.055em;
+	line-height: .95;
+}
+
+body.jf-page-heatmap .sub {
+	margin-top: 4px;
+	color: var(--muted);
+	font-size: clamp(12px, 1.6vw, 16px);
+	font-weight: 700;
+}
+
+body.jf-page-heatmap .livePill {
+	padding: 7px 13px;
+	border-radius: 999px;
+	background: rgba(53,230,107,.13);
+	border: 1px solid rgba(53,230,107,.28);
+	color: rgba(210,255,225,.92);
+	font-size: 12px;
+	font-weight: 900;
+	white-space: nowrap;
+}
+
+body.jf-page-heatmap .stats {
+	display: grid;
+	grid-template-columns: repeat(4, minmax(0, 1fr));
+	gap: 8px;
+}
+
+body.jf-page-heatmap .stat {
+	min-height: 44px;
+	border-radius: 18px;
+	background: rgba(255,255,255,.07);
+	border: 1px solid rgba(255,255,255,.12);
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	padding: 5px 6px;
+	overflow: hidden;
+}
+
+body.jf-page-heatmap .value {
+	font-size: clamp(24px, 5vw, 38px);
+	font-weight: 950;
+	letter-spacing: -.05em;
+	line-height: .9;
+}
+
+body.jf-page-heatmap .label {
+	margin-top: 4px;
+	font-size: 7px;
+	letter-spacing: .13em;
+	color: var(--muted);
+	font-weight: 850;
+	white-space: nowrap;
+}
+
+body.jf-page-heatmap .rush {
+	min-height: 38px;
+	max-height: 42px;
+	border-radius: 18px;
+	padding: 7px 12px;
+	background: rgba(255,216,77,.10);
+	border: 1px solid rgba(255,216,77,.22);
+	color: rgba(255,240,170,.94);
+	font-size: clamp(13px, 2.4vw, 18px);
+	font-weight: 900;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 10px;
+	white-space: nowrap;
+	overflow: hidden;
+}
+
+body.jf-page-heatmap .rush span {
+	min-width: 0;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+body.jf-page-heatmap .scroller {
+	min-height: 0;
+	height: 100%;
+	display: flex;
+	align-items: stretch;
+	gap: 12px;
+	overflow-x: auto;
+	overflow-y: hidden;
+	scroll-snap-type: x mandatory;
+	padding: 0 4px 4px;
+	-webkit-overflow-scrolling: touch;
+}
+
+body.jf-page-heatmap .scroller::-webkit-scrollbar {
+	display: none;
+}
+
+body.jf-page-heatmap .hourCard {
+	scroll-snap-align: center;
+	flex: 0 0 min(430px, 74vw);
+	height: 100%;
+	min-height: 0;
+	border-radius: 26px;
+	padding: 16px;
+	background: rgba(255,255,255,.075);
+	border: 1px solid rgba(255,255,255,.12);
+	position: relative;
+	overflow: hidden;
+	display: flex;
+	align-items: stretch;
+}
+
+body.jf-page-heatmap .hourCard::before {
+	content: "";
+	position: absolute;
+	inset: 0;
+	opacity: var(--heat, .08);
+	background:
+		radial-gradient(circle at 50% 0%, rgba(53,230,107,.9), transparent 62%),
+		linear-gradient(145deg, rgba(86,168,255,.7), rgba(255,216,77,.6));
+	pointer-events: none;
+}
+
+body.jf-page-heatmap .hourCard.now {
+	border-color: rgba(53,230,107,.4);
+	box-shadow: 0 0 28px rgba(53,230,107,.16);
+}
+
+body.jf-page-heatmap .hourInner {
+	position: relative;
+	z-index: 2;
+	width: 100%;
+	display: flex;
+	flex-direction: column;
+}
+
+body.jf-page-heatmap .hourTop {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	gap: 12px;
+}
+
+body.jf-page-heatmap .hour {
+	font-size: clamp(34px, 8vw, 66px);
+	font-weight: 950;
+	letter-spacing: -.055em;
+	line-height: .95;
+}
+
+body.jf-page-heatmap .badge {
+	padding: 5px 9px;
+	border-radius: 999px;
+	background: rgba(0,0,0,.22);
+	border: 1px solid rgba(255,255,255,.13);
+	color: rgba(255,255,255,.78);
+	font-size: clamp(10px, 1.7vw, 14px);
+	font-weight: 850;
+	white-space: nowrap;
+}
+
+body.jf-page-heatmap .hourTotal {
+	font-size: clamp(78px, 17vw, 138px);
+	line-height: .82;
+	font-weight: 950;
+	letter-spacing: -.075em;
+	margin-top: auto;
+}
+
+body.jf-page-heatmap .hourSub {
+	margin-top: 8px;
+	color: var(--muted);
+	font-size: clamp(16px, 3.2vw, 26px);
+	font-weight: 800;
+}
+
+body.jf-page-heatmap .bars {
+	display: grid;
+	grid-template-columns: repeat(3, 1fr);
+	gap: 8px;
+	margin-top: auto;
+}
+
+body.jf-page-heatmap .bar {
+	height: 42px;
+	border-radius: 14px;
+	background: rgba(255,255,255,.10);
+	border: 1px solid rgba(255,255,255,.12);
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	font-weight: 900;
+	font-size: clamp(12px, 2.2vw, 18px);
+}
+
+body.jf-page-heatmap .rankings {
+	min-height: 0;
+	display: grid;
+	grid-template-columns: 1fr 1fr;
+	gap: 10px;
+}
+
+body.jf-page-heatmap .panel {
+	min-height: 0;
+	height: 100%;
+	border-radius: 20px;
+	background: rgba(255,255,255,.075);
+	border: 1px solid rgba(255,255,255,.12);
+	padding: 12px 14px;
+	overflow: hidden;
+}
+
+body.jf-page-heatmap .panel h3 {
+	margin: 0 0 8px;
+	font-size: clamp(13px, 2vw, 17px);
+	letter-spacing: .10em;
+	color: var(--muted);
+	text-transform: uppercase;
+}
+
+body.jf-page-heatmap .panel pre {
+	margin: 0;
+	white-space: pre-wrap;
+	font-family: inherit;
+	font-size: clamp(12px, 1.8vw, 16px);
+	line-height: 1.18;
+	font-weight: 800;
+	color: rgba(255,255,255,.90);
+}
+
+body.jf-page-heatmap .footer {
+	display: none;
+}
+
+@media (orientation: landscape) {
+	body.jf-page-heatmap .jf-shell {
+		padding: 14px 26px !important;
+		grid-template-rows: auto auto auto minmax(0, 1fr) 108px !important;
+		gap: 8px !important;
+	}
+
+	body.jf-page-heatmap .stats {
+		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
+		gap: 10px !important;
+	}
+
+	body.jf-page-heatmap .stat {
+		min-height: 48px !important;
+		border-radius: 17px !important;
+		padding: 4px 8px !important;
+	}
+
+	body.jf-page-heatmap .value {
+		font-size: clamp(24px, 3.1vw, 34px) !important;
+	}
+
+	body.jf-page-heatmap .rush {
+		min-height: 34px !important;
+		max-height: 36px !important;
+		padding: 6px 14px !important;
+		font-size: clamp(13px, 1.55vw, 18px) !important;
+	}
+
+	body.jf-page-heatmap .hourCard {
+		flex: 0 0 min(340px, 32vw) !important;
+		border-radius: 22px !important;
+		padding: 15px 18px !important;
+	}
+
+	body.jf-page-heatmap .hour {
+		font-size: clamp(30px, 3.8vw, 50px) !important;
+	}
+
+	body.jf-page-heatmap .hourTotal {
+		font-size: clamp(58px, 6.8vw, 92px) !important;
+	}
+
+	body.jf-page-heatmap .hourSub {
+		font-size: clamp(14px, 1.7vw, 20px) !important;
+	}
+
+	body.jf-page-heatmap .bar {
+		height: 34px !important;
+		border-radius: 12px !important;
+		font-size: 13px !important;
+	}
+
+	body.jf-page-heatmap .rankings {
+		height: 108px !important;
+	}
+
+	body.jf-page-heatmap .panel {
+		border-radius: 18px !important;
+		padding: 10px 14px !important;
+	}
+
+	body.jf-page-heatmap .panel h3 {
+		font-size: 12px !important;
+		margin-bottom: 5px !important;
+	}
+
+	body.jf-page-heatmap .panel pre {
+		font-size: clamp(11px, 1.25vw, 14px) !important;
+		line-height: 1.12 !important;
+	}
+}
+
+
+/* ==================================================
+   Stats
+================================================== */
+
+body.jf-page-stats .jf-shell {
+	display: grid;
+	grid-template-rows: auto auto 1fr;
+	gap: 10px;
+}
+
+body.jf-page-stats .header {
+	display: flex;
+	align-items: flex-start;
+	justify-content: space-between;
+	gap: 12px;
+}
+
+body.jf-page-stats .title {
+	font-size: clamp(24px, 4.5vw, 42px);
+	font-weight: 950;
+	letter-spacing: -.055em;
+	line-height: .95;
+}
+
+body.jf-page-stats .sub {
+	margin-top: 4px;
+	color: var(--muted);
+	font-size: clamp(12px, 1.6vw, 16px);
+	font-weight: 700;
+}
+
+body.jf-page-stats .grid {
+	display: grid;
+	grid-template-columns: repeat(3, 1fr);
+	gap: 10px;
+}
+
+body.jf-page-stats .stat {
+	min-height: 78px;
+	border-radius: 22px;
+	background: rgba(255,255,255,.075);
+	border: 1px solid rgba(255,255,255,.12);
+	padding: 12px;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	overflow: hidden;
+}
+
+body.jf-page-stats .stat.big {
+	background: linear-gradient(145deg, rgba(86,168,255,.20), rgba(53,230,107,.11));
+}
+
+body.jf-page-stats .stat.warn {
+	background: linear-gradient(145deg, rgba(255,216,77,.20), rgba(255,90,90,.10));
+}
+
+body.jf-page-stats .label {
+	color: var(--muted);
+	font-size: 10px;
+	font-weight: 850;
+	letter-spacing: .13em;
+	text-transform: uppercase;
+	white-space: nowrap;
+}
+
+body.jf-page-stats .value {
+	margin-top: 5px;
+	font-size: clamp(24px, 4vw, 42px);
+	font-weight: 950;
+	line-height: .9;
+	letter-spacing: -.055em;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+body.jf-page-stats .small {
+	margin-top: 4px;
+	color: var(--muted);
+	font-size: 12px;
+	font-weight: 700;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+body.jf-page-stats .panels {
+	min-height: 0;
+	display: grid;
+	grid-template-columns: 1fr 1fr;
+	grid-template-rows: 1fr 1fr;
+	gap: 10px;
+}
+
+body.jf-page-stats .panel {
+	min-height: 0;
+	border-radius: 22px;
+	background: rgba(255,255,255,.07);
+	border: 1px solid rgba(255,255,255,.11);
+	padding: 12px;
+	overflow: hidden;
+}
+
+body.jf-page-stats .panel h3 {
+	margin: 0 0 8px;
+	color: var(--muted);
+	font-size: 12px;
+	font-weight: 900;
+	letter-spacing: .12em;
+	text-transform: uppercase;
+}
+
+body.jf-page-stats .panel pre {
+	margin: 0;
+	font-family: inherit;
+	font-size: clamp(10px, 1.4vw, 15px);
+	line-height: 1.22;
+	font-weight: 760;
+	color: rgba(255,255,255,.9);
+	white-space: pre-wrap;
+}
+
+@media (orientation: portrait) {
+	body.jf-page-stats .grid {
+		grid-template-columns: repeat(2, 1fr);
+	}
+
+	body.jf-page-stats .panels {
+		grid-template-columns: 1fr;
+		grid-template-rows: repeat(4, 1fr);
+	}
+}
+
+
+
+/* ==================================================
+   Home
+================================================== */
+
+body.jf-page-home .jf-shell {
+	display: flex;
+	flex-direction: column;
+	gap: 18px;
+}
+
+body.jf-page-home .hero {
+	flex: 1 1 auto;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	min-height: 0;
+}
+
+body.jf-page-home .logo {
+	font-size: clamp(54px, 14vw, 96px);
+	line-height: .9;
+	margin-bottom: 14px;
+}
+
+body.jf-page-home h1 {
+	margin: 0;
+	font-size: clamp(42px, 11vw, 76px);
+	line-height: .88;
+	letter-spacing: -.07em;
+	font-weight: 950;
+}
+
+body.jf-page-home .sub {
+	margin-top: 14px;
+	color: var(--muted);
+	font-size: clamp(17px, 4vw, 28px);
+	font-weight: 750;
+}
+
+body.jf-page-home .status,
+body.jf-page-home [id="statusText"] {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	width: fit-content;
+	max-width: 92%;
+	margin: 18px auto 0 auto;
+	padding: 9px 18px;
+	border-radius: 999px;
+	background: rgba(53,230,107,.13);
+	border: 1px solid rgba(53,230,107,.28);
+	color: rgba(210,255,225,.94);
+	font-size: clamp(11px, 2vw, 15px);
+	font-weight: 850;
+	line-height: 1;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+body.jf-page-home .buttons {
+	display: grid;
+	grid-template-columns: 1fr;
+	gap: 12px;
+}
+
+body.jf-page-home a {
+	text-decoration: none;
+	color: white;
+}
+
+body.jf-page-home .btn {
+	border-radius: 26px;
+	padding: 20px;
+	background: rgba(255,255,255,.085);
+	border: 1px solid rgba(255,255,255,.14);
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 14px;
+	box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
+}
+
+body.jf-page-home .btn.primary {
+	background: linear-gradient(145deg, rgba(86,168,255,.40), rgba(53,230,107,.24));
+	border-color: rgba(86,168,255,.34);
+}
+
+body.jf-page-home .btn.heat {
+	background: linear-gradient(145deg, rgba(255,216,77,.32), rgba(255,90,90,.20));
+	border-color: rgba(255,216,77,.30);
+}
+
+body.jf-page-home .btnTitle {
+	font-size: clamp(22px, 5vw, 34px);
+	font-weight: 920;
+	letter-spacing: -.035em;
+}
+
+body.jf-page-home .btnSub {
+	margin-top: 4px;
+	color: var(--muted);
+	font-size: clamp(12px, 2.8vw, 16px);
+	font-weight: 700;
+}
+
+body.jf-page-home .arrow {
+	font-size: 28px;
+	font-weight: 700;
+	color: rgba(255,255,255,.82);
+}
+
+body.jf-page-home .stats {
+	display: grid;
+	grid-template-columns: repeat(3, 1fr);
+	gap: 10px;
+}
+
+body.jf-page-home .stat {
+	min-height: 70px;
+	border-radius: 20px;
+	background: rgba(255,255,255,.075);
+	border: 1px solid rgba(255,255,255,.12);
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+}
+
+body.jf-page-home .value {
+	font-size: clamp(28px, 6vw, 46px);
+	font-weight: 950;
+	line-height: .9;
+	letter-spacing: -.05em;
+}
+
+body.jf-page-home .label {
+	margin-top: 5px;
+	font-size: 10px;
+	letter-spacing: .16em;
+	color: var(--muted);
+	font-weight: 850;
+}
+
+body.jf-page-home .footer {
+	color: rgba(255,255,255,.86);
+	font-size: 14px;
+	font-weight: 600;
+}
+
+@media (orientation: landscape) {
+	body.jf-page-home .jf-shell {
+		display: grid;
+		grid-template-columns: 40% 60%;
+		grid-template-rows: 1fr auto;
+		gap: 14px;
+		padding: 18px;
+	}
+
+	body.jf-page-home .hero {
+		grid-column: 1;
+		grid-row: 1 / span 2;
+		justify-content: center;
+		align-items: flex-start;
+	}
+
+	body.jf-page-home .buttons {
+		grid-column: 2;
+		grid-row: 1;
+		align-self: center;
+		gap: 10px;
+	}
+
+	body.jf-page-home .btn {
+		min-height: 72px;
+		padding: 14px 18px;
+		border-radius: 22px;
+	}
+
+	body.jf-page-home .btnTitle {
+		font-size: clamp(24px, 3.2vw, 40px);
+	}
+
+	body.jf-page-home .btnSub {
+		font-size: clamp(12px, 1.5vw, 18px);
+	}
+
+	body.jf-page-home .stats {
+		grid-column: 2;
+		grid-row: 2;
+	}
+
+	body.jf-page-home .stat {
+		min-height: 44px;
+		border-radius: 16px;
+	}
+
+	body.jf-page-home .value {
+		font-size: clamp(24px, 3.2vw, 38px);
+	}
+
+	body.jf-page-home .label {
+		font-size: 8px;
+	}
+
+	body.jf-page-home .status,
+	body.jf-page-home [id="statusText"] {
+		margin: 12px 0 0 0;
+		padding: 7px 14px;
+		font-size: clamp(8px, 1.15vw, 12px);
+		max-width: 100%;
+	}
+
+	body.jf-page-home .footer {
+		position: absolute;
+		left: 22px;
+		bottom: 16px;
+		margin: 0;
+		font-size: 12px;
+	}
+}
+
+@keyframes radarSpin {
+	to { transform: rotate(360deg); }
+}
+
+@keyframes idleFloat {
+	0%,100% { transform: translateY(0) rotate(-8deg); }
+	50% { transform: translateY(-9px) rotate(-2deg); }
+}
+
+
+/* ==================================================
+   Home final shell layout
+================================================== */
+
+body.jf-page-home .jf-shell {
+	display: flex;
+	flex-direction: column;
+	gap: 18px;
+}
+
+body.jf-page-home .hero {
+	flex: 1 1 auto;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	min-height: 0;
+}
+
+body.jf-page-home .logo {
+	font-size: clamp(54px, 14vw, 96px);
+	line-height: .9;
+	margin-bottom: 14px;
+}
+
+body.jf-page-home h1 {
+	margin: 0;
+	font-size: clamp(42px, 11vw, 76px);
+	line-height: .88;
+	letter-spacing: -.07em;
+	font-weight: 950;
+}
+
+body.jf-page-home .sub {
+	margin-top: 14px;
+	color: var(--muted);
+	font-size: clamp(17px, 4vw, 28px);
+	font-weight: 750;
+}
+
+body.jf-page-home .status,
+body.jf-page-home [id="statusText"] {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	width: fit-content;
+	max-width: 92%;
+	margin: 18px auto 0 auto;
+	padding: 9px 18px;
+	border-radius: 999px;
+	background: rgba(53,230,107,.13);
+	border: 1px solid rgba(53,230,107,.28);
+	color: rgba(210,255,225,.94);
+	font-size: clamp(11px, 2vw, 15px);
+	font-weight: 850;
+	line-height: 1;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+body.jf-page-home .buttons {
+	display: grid;
+	grid-template-columns: 1fr;
+	gap: 12px;
+}
+
+body.jf-page-home a {
+	text-decoration: none;
+	color: white;
+}
+
+body.jf-page-home .btn {
+	border-radius: 26px;
+	padding: 20px;
+	background: rgba(255,255,255,.085);
+	border: 1px solid rgba(255,255,255,.14);
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 14px;
+	box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
+}
+
+body.jf-page-home .btn.primary {
+	background: linear-gradient(145deg, rgba(86,168,255,.40), rgba(53,230,107,.24));
+	border-color: rgba(86,168,255,.34);
+}
+
+body.jf-page-home .btn.heat {
+	background: linear-gradient(145deg, rgba(255,216,77,.32), rgba(255,90,90,.20));
+	border-color: rgba(255,216,77,.30);
+}
+
+body.jf-page-home .btnTitle {
+	font-size: clamp(22px, 5vw, 34px);
+	font-weight: 920;
+	letter-spacing: -.035em;
+}
+
+body.jf-page-home .btnSub {
+	margin-top: 4px;
+	color: var(--muted);
+	font-size: clamp(12px, 2.8vw, 16px);
+	font-weight: 700;
+}
+
+body.jf-page-home .arrow {
+	font-size: 28px;
+	font-weight: 700;
+	color: rgba(255,255,255,.82);
+}
+
+body.jf-page-home .stats {
+	display: grid;
+	grid-template-columns: repeat(3, 1fr);
+	gap: 10px;
+}
+
+body.jf-page-home .stat {
+	min-height: 70px;
+	border-radius: 20px;
+	background: rgba(255,255,255,.075);
+	border: 1px solid rgba(255,255,255,.12);
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+}
+
+body.jf-page-home .value {
+	font-size: clamp(28px, 6vw, 46px);
+	font-weight: 950;
+	line-height: .9;
+	letter-spacing: -.05em;
+}
+
+body.jf-page-home .label {
+	margin-top: 5px;
+	font-size: 10px;
+	letter-spacing: .16em;
+	color: var(--muted);
+	font-weight: 850;
+}
+
+body.jf-page-home .footer {
+	color: rgba(255,255,255,.86);
+	font-size: 14px;
+	font-weight: 600;
+}
+
+@media (orientation: landscape) {
+	body.jf-page-home .jf-shell {
+		display: grid;
+		grid-template-columns: 40% 60%;
+		grid-template-rows: 1fr auto;
+		gap: 14px;
+		padding: 18px;
+	}
+
+	body.jf-page-home .hero {
+		grid-column: 1;
+		grid-row: 1 / span 2;
+		justify-content: center;
+		align-items: flex-start;
+	}
+
+	body.jf-page-home .buttons {
+		grid-column: 2;
+		grid-row: 1;
+		align-self: center;
+		gap: 10px;
+	}
+
+	body.jf-page-home .stats {
+		grid-column: 2;
+		grid-row: 2;
+	}
+
+	body.jf-page-home .btn {
+		min-height: 72px;
+		padding: 14px 18px;
+		border-radius: 22px;
+	}
+
+	body.jf-page-home .stat {
+		min-height: 44px;
+		border-radius: 16px;
+	}
+
+	body.jf-page-home .status,
+	body.jf-page-home [id="statusText"] {
+		margin: 12px 0 0 0;
+		padding: 7px 14px;
+		font-size: clamp(8px, 1.15vw, 12px);
+		max-width: 100%;
+	}
+
+	body.jf-page-home .footer {
+		position: absolute;
+		left: 22px;
+		bottom: 16px;
+		margin: 0;
+		font-size: 12px;
+	}
+}
+
+/* ==================================================
+   HOME LANDSCAPE STATS FINAL
+================================================== */
+
+@media (orientation: landscape) {
+	body.jf-page-home .jf-shell {
+		grid-template-rows: minmax(0, 1fr) 54px !important;
+		gap: 10px !important;
+		padding-bottom: 12px !important;
+	}
+
+	body.jf-page-home .stats {
+		align-self: end !important;
+		height: 54px !important;
+	}
+
+	body.jf-page-home .stat {
+		min-height: 54px !important;
+		height: 54px !important;
+		padding: 4px 8px !important;
+	}
+
+	body.jf-page-home .value {
+		font-size: clamp(24px, 3vw, 34px) !important;
+		line-height: .9 !important;
+	}
+
+	body.jf-page-home .label {
+		margin-top: 3px !important;
+		font-size: 7px !important;
+		line-height: 1 !important;
+	}
+
+	body.jf-page-home .footer {
+		bottom: 10px !important;
+	}
+}
+
+
+
+
+/* ==================================================
+   HEATMAP FINAL MICRO REPLACE
+================================================== */
+
+/* Backbutton wirklich in die Header-Reihe */
+body.jf-page-heatmap .header {
+	display: grid !important;
+	grid-template-columns: 34px minmax(0, 1fr) auto !important;
+	align-items: center !important;
+	gap: 10px !important;
+	padding-left: 0 !important;
+	position: relative !important;
+}
+
+body.jf-page-heatmap .backBtn {
+	position: static !important;
+	width: 34px !important;
+	height: 34px !important;
+	flex: 0 0 34px !important;
+	margin: 0 !important;
+	z-index: 10 !important;
+}
+
+@media (orientation: portrait) {
+	body.jf-page-heatmap .header {
+		grid-template-columns: 34px minmax(0, 1fr) auto !important;
+	}
+
+	body.jf-page-heatmap .title {
+		font-size: clamp(24px, 6vw, 34px) !important;
+	}
+
+	body.jf-page-heatmap .sub {
+		font-size: clamp(12px, 3vw, 15px) !important;
+	}
+}
+
+/* Querformat: links Swipe groß, rechts Ranking klein passend */
+@media (orientation: landscape) {
+	body.jf-page-heatmap .jf-shell {
+		display: grid !important;
+		grid-template-columns: minmax(0, 58%) minmax(0, 42%) !important;
+		grid-template-rows: auto 48px 34px minmax(0, 1fr) !important;
+		gap: 8px 14px !important;
+		padding: 14px 26px !important;
+	}
+
+	body.jf-page-heatmap .header {
+		grid-column: 1 / 3 !important;
+		grid-row: 1 !important;
+		grid-template-columns: 34px minmax(0, 1fr) auto !important;
+		min-height: 36px !important;
+	}
+
+	body.jf-page-heatmap .stats {
+		grid-column: 1 / 3 !important;
+		grid-row: 2 !important;
+	}
+
+	body.jf-page-heatmap .rush {
+		grid-column: 1 / 3 !important;
+		grid-row: 3 !important;
+		height: 34px !important;
+		min-height: 34px !important;
+		max-height: 34px !important;
+		padding: 5px 14px !important;
+		font-size: clamp(13px, 1.45vw, 17px) !important;
+	}
+
+	body.jf-page-heatmap .scroller {
+		grid-column: 1 !important;
+		grid-row: 4 !important;
+		height: 100% !important;
+		min-height: 0 !important;
+	}
+
+	body.jf-page-heatmap .rankings {
+		grid-column: 2 !important;
+		grid-row: 4 !important;
+		display: grid !important;
+		grid-template-columns: 1fr !important;
+		grid-template-rows: 1fr 1fr !important;
+		gap: 10px !important;
+		height: 100% !important;
+		min-height: 0 !important;
+	}
+
+	body.jf-page-heatmap .rankings .panel {
+		padding: 10px 13px !important;
+		overflow: hidden !important;
+	}
+
+	body.jf-page-heatmap .rankings .panel h3 {
+		font-size: 10px !important;
+		line-height: 1 !important;
+		margin: 0 0 5px !important;
+		letter-spacing: 1.8px !important;
+	}
+
+	body.jf-page-heatmap #airlineRanking,
+	body.jf-page-heatmap #routeRanking {
+		font-size: 10px !important;
+		line-height: 1.08 !important;
+		font-weight: 800 !important;
+		letter-spacing: 0 !important;
+	}
+}
+
+
+/* ==================================================
+   JETFRAME DESIGN SYSTEM CLEAN V1
+   Einheitliche Header / Pills / Boxen / responsive Text
+================================================== */
+
+@font-face {
+	font-family: "JetFrameSF";
+	src: url("SF-Pro.ttf") format("truetype");
+	font-weight: 100 1000;
+	font-style: normal;
+	font-display: swap;
+}
+
+:root {
+	--jf-font: "JetFrameSF", -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", Arial, sans-serif;
+
+	--jf-text-xs: clamp(8px, 1.05cqw, 12px);
+	--jf-text-sm: clamp(10px, 1.35cqw, 15px);
+	--jf-text-md: clamp(13px, 1.75cqw, 20px);
+	--jf-text-lg: clamp(20px, 3.2cqw, 38px);
+	--jf-text-xl: clamp(30px, 5.2cqw, 64px);
+
+	--jf-radius-shell: clamp(26px, 4cqw, 34px);
+	--jf-radius-box: clamp(18px, 3cqw, 28px);
+
+	--jf-gap: clamp(8px, 1.35cqw, 16px);
+	--jf-pad: clamp(14px, 2.2cqw, 26px);
+
+	--jf-box-bg: rgba(255,255,255,.075);
+	--jf-box-border: 1px solid rgba(255,255,255,.13);
+}
+
+html,
+body,
+button,
+input,
+textarea,
+select {
+	font-family: var(--jf-font) !important;
+}
+
+.card,
+.wall,
+.jf-shell {
+	container-type: size;
+	border-radius: var(--jf-radius-shell) !important;
+	padding: var(--jf-pad) !important;
+	overflow: hidden !important;
+}
+
+/* ---------- Einheitlicher Header auf allen Unterseiten ---------- */
+
+body:not(.jf-page-home) .header {
+	display: grid !important;
+	grid-template-columns: clamp(30px, 4cqw, 42px) minmax(0, 1fr) auto !important;
+	grid-template-rows: auto auto !important;
+	column-gap: clamp(8px, 1.3cqw, 14px) !important;
+	align-items: center !important;
+
+	height: clamp(48px, 8cqh, 74px) !important;
+	min-height: clamp(48px, 8cqh, 74px) !important;
+	margin: 0 0 var(--jf-gap) 0 !important;
+	padding: 0 !important;
+	overflow: visible !important;
+}
+
+body:not(.jf-page-home) .backBtn {
+	position: static !important;
+	grid-column: 1 !important;
+	grid-row: 1 / span 2 !important;
+	width: clamp(30px, 4cqw, 42px) !important;
+	height: clamp(30px, 4cqw, 42px) !important;
+	margin: 0 !important;
+	align-self: center !important;
+}
+
+body:not(.jf-page-home) .header > div:not(.livePill):not(.frameHeaderActions),
+body:not(.jf-page-home) .headerTitleBlock {
+	grid-column: 2 !important;
+	grid-row: 1 / span 2 !important;
+	min-width: 0 !important;
+	align-self: center !important;
+	overflow: visible !important;
+}
+
+body:not(.jf-page-home) .title {
+	margin: 0 !important;
+	padding: 0 !important;
+	font-size: clamp(25px, 4.1cqw, 44px) !important;
+	font-weight: 950 !important;
+	line-height: .98 !important;
+	letter-spacing: -.06em !important;
+	color: #fff !important;
+	white-space: nowrap !important;
+	overflow: visible !important;
+	text-overflow: clip !important;
+}
+
+body:not(.jf-page-home) .sub {
+	margin: 1px 0 0 0 !important;
+	font-size: clamp(12px, 1.7cqw, 18px) !important;
+	font-weight: 760 !important;
+	line-height: 1.08 !important;
+	color: rgba(255,255,255,.62) !important;
+	white-space: nowrap !important;
+	overflow: hidden !important;
+	text-overflow: ellipsis !important;
+}
+
+/* ---------- Einheitliche Live-Pille ---------- */
+
+body:not(.jf-page-home) .livePill,
+body:not(.jf-page-home) .frameLivePill {
+	grid-column: 3 !important;
+	grid-row: 1 / span 2 !important;
+	justify-self: end !important;
+	align-self: center !important;
+
+	display: inline-flex !important;
+	align-items: center !important;
+	justify-content: center !important;
+	gap: .55em !important;
+
+	height: clamp(32px, 4.5cqw, 44px) !important;
+	min-width: clamp(74px, 10cqw, 104px) !important;
+	padding: 0 clamp(12px, 1.7cqw, 18px) !important;
+
+	border-radius: 999px !important;
+	background: rgba(53,230,107,.13) !important;
+	border: 1px solid rgba(53,230,107,.32) !important;
+	box-shadow: 0 0 22px rgba(53,230,107,.14) !important;
+
+	color: rgba(210,255,225,.96) !important;
+	font-size: clamp(13px, 1.75cqw, 18px) !important;
+	font-weight: 900 !important;
+	line-height: 1 !important;
+}
+
+body:not(.jf-page-home) .livePill::before,
+body:not(.jf-page-home) .frameLivePill::before {
+	content: "";
+	width: clamp(8px, 1.2cqw, 12px);
+	height: clamp(8px, 1.2cqw, 12px);
+	border-radius: 50%;
+	background: var(--green);
+	box-shadow: 0 0 14px rgba(53,230,107,.75);
+}
+
+body:not(.jf-page-home) .livePill .dot,
+body:not(.jf-page-home) .frameLivePill .dot {
+	display: none !important;
+}
+
+/* Live-Frame: Speaker links neben Live-Pille */
+
+
+
+/* ---------- Grundbausteine ---------- */
+
+.jf-box,
+.stat,
+.metric,
+.panel,
+.hourCard {
+	border-radius: var(--jf-radius-box) !important;
+	background: var(--jf-box-bg) !important;
+	border: var(--jf-box-border) !important;
+}
+
+.value,
+.metricValue,
+.hourTotal,
+.iataCallsign {
+	font-weight: 950 !important;
+	line-height: .9 !important;
+	letter-spacing: -.055em !important;
+}
+
+.label,
+.metricLabel,
+.panel h3 {
+	font-size: var(--jf-text-xs) !important;
+	font-weight: 850 !important;
+	letter-spacing: .16em !important;
+	color: rgba(255,255,255,.62) !important;
+	text-transform: uppercase !important;
+}
+
+/* ---------- Live Frame ---------- */
+
+
+
+
+
+
+
+
+/* Warte-Ansicht ruhiger */
+
+
+/* ---------- Heatmap ---------- */
+
+body.jf-page-heatmap .rush {
+	display: grid !important;
+	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
+	align-items: center !important;
+	gap: clamp(8px, 1.6cqw, 18px) !important;
+	min-height: clamp(32px, 4.6cqh, 44px) !important;
+	padding: 0 clamp(12px, 2cqw, 22px) !important;
+	font-size: clamp(11px, 1.65cqw, 18px) !important;
+	line-height: 1 !important;
+	white-space: nowrap !important;
+	overflow: hidden !important;
+}
+
+body.jf-page-heatmap .rush span {
+	min-width: 0 !important;
+	overflow: hidden !important;
+	text-overflow: ellipsis !important;
+	white-space: nowrap !important;
+}
+
+body.jf-page-heatmap .rush span:last-child {
+	text-align: right !important;
+}
+
+body.jf-page-heatmap .stat {
+	min-height: clamp(50px, 7.5cqh, 76px) !important;
+}
+
+body.jf-page-heatmap .value {
+	font-size: clamp(24px, 5cqw, 42px) !important;
+}
+
+body.jf-page-heatmap .hour {
+	font-size: clamp(30px, 5.5cqw, 58px) !important;
+}
+
+body.jf-page-heatmap .hourTotal {
+	font-size: clamp(62px, 13cqw, 120px) !important;
+}
+
+body.jf-page-heatmap .hourSub {
+	font-size: clamp(14px, 2.4cqw, 24px) !important;
+}
+
+body.jf-page-heatmap .panel pre {
+	font-size: clamp(10px, 1.65cqw, 15px) !important;
+	line-height: 1.08 !important;
+}
+
+/* ---------- Statistik ---------- */
+
+body.jf-page-stats .value {
+	font-size: clamp(30px, 5.4cqw, 64px) !important;
+}
+
+body.jf-page-stats .small {
+	font-size: clamp(11px, 1.85cqw, 17px) !important;
+	line-height: 1.12 !important;
+}
+
+body.jf-page-stats .panel pre {
+	font-size: clamp(9px, 1.45cqw, 14px) !important;
+	line-height: 1.08 !important;
+	overflow: hidden !important;
+}
+
+/* ---------- Portrait ---------- */
+
+@media (orientation: portrait) {
+	.card,
+	.wall,
+	.jf-shell {
+		width: 96vw !important;
+		height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 20px) !important;
+	}
+
+	body.jf-page-heatmap .card,
+	body.jf-page-heatmap .jf-shell {
+		display: grid !important;
+		grid-template-rows:
+			auto
+			auto
+			auto
+			minmax(0, 1fr)
+			clamp(132px, 18cqh, 210px) !important;
+		gap: var(--jf-gap) !important;
+	}
+
+	body.jf-page-heatmap .stats {
+		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
+		gap: clamp(6px, 1.2cqw, 10px) !important;
+	}
+
+	body.jf-page-heatmap .hourCard {
+		flex: 0 0 clamp(250px, 78cqw, 580px) !important;
+		height: 100% !important;
+	}
+
+	body.jf-page-heatmap .rankings {
+		grid-template-columns: 1fr 1fr !important;
+		gap: var(--jf-gap) !important;
+	}
+
+	body.jf-page-stats .grid {
+		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
+		gap: var(--jf-gap) !important;
+	}
+
+	body.jf-page-stats .panels {
+		grid-template-columns: 1fr !important;
+		grid-template-rows: 1.05fr 1.15fr 1.25fr 1.25fr !important;
+		gap: var(--jf-gap) !important;
+		min-height: 0 !important;
+	}
+
+	body.jf-page-stats .panel {
+		min-height: 0 !important;
+		overflow: hidden !important;
+	}
+}
+
+/* ---------- Landscape ---------- */
+
+@media (orientation: landscape) {
+	.card,
+	.wall,
+	.jf-shell {
+		width: min(1280px, 92vw) !important;
+		height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 18px) !important;
+	}
+
+	body:not(.jf-page-home) .header {
+		height: clamp(44px, 9cqh, 66px) !important;
+		min-height: clamp(44px, 9cqh, 66px) !important;
+	}
+
+	body:not(.jf-page-home) .title {
+		font-size: clamp(26px, 3.8cqw, 48px) !important;
+	}
+
+	body:not(.jf-page-home) .sub {
+		font-size: clamp(11px, 1.25cqw, 17px) !important;
+	}
+
+	body.jf-page-heatmap .card,
+	body.jf-page-heatmap .jf-shell {
+		display: grid !important;
+		grid-template-columns: minmax(0, .56fr) minmax(250px, .44fr) !important;
+		grid-template-rows: auto auto auto minmax(0, 1fr) !important;
+		gap: clamp(7px, 1.2cqh, 12px) clamp(12px, 1.5cqw, 20px) !important;
+	}
+
+	body.jf-page-heatmap .header,
+	body.jf-page-heatmap .stats,
+	body.jf-page-heatmap .rush {
+		grid-column: 1 / -1 !important;
+	}
+
+	body.jf-page-heatmap .stats {
+		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
+	}
+
+	body.jf-page-heatmap .scroller {
+		grid-column: 1 !important;
+		grid-row: 4 !important;
+		min-height: 0 !important;
+		height: 100% !important;
+	}
+
+	body.jf-page-heatmap .hourCard {
+		flex: 0 0 clamp(210px, 25cqw, 340px) !important;
+		height: 100% !important;
+	}
+
+	body.jf-page-heatmap .hourTotal {
+		font-size: clamp(48px, 6cqw, 88px) !important;
+	}
+
+	body.jf-page-heatmap .rankings {
+		grid-column: 2 !important;
+		grid-row: 4 !important;
+		grid-template-columns: 1fr !important;
+		grid-template-rows: 1fr 1fr !important;
+		min-height: 0 !important;
+	}
+
+	body.jf-page-heatmap .panel pre {
+		font-size: clamp(8px, .95cqw, 13px) !important;
+	}
+
+	body.jf-page-stats .card,
+	body.jf-page-stats .jf-shell {
+		display: grid !important;
+		grid-template-columns: minmax(0, .57fr) minmax(280px, .43fr) !important;
+		grid-template-rows: auto minmax(0, 1fr) !important;
+		gap: clamp(8px, 1.25cqh, 12px) clamp(12px, 1.6cqw, 20px) !important;
+	}
+
+	body.jf-page-stats .header {
+		grid-column: 1 / -1 !important;
+	}
+
+	body.jf-page-stats .grid {
+		grid-column: 1 !important;
+		grid-row: 2 !important;
+		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
+		grid-template-rows: repeat(3, minmax(0, 1fr)) !important;
+		min-height: 0 !important;
+		gap: var(--jf-gap) !important;
+	}
+
+	body.jf-page-stats .panels {
+		grid-column: 2 !important;
+		grid-row: 2 !important;
+		grid-template-columns: 1fr !important;
+		grid-template-rows: repeat(4, minmax(0, 1fr)) !important;
+		min-height: 0 !important;
+		gap: var(--jf-gap) !important;
+	}
+
+	body.jf-page-stats .panel {
+		min-height: 0 !important;
+		overflow: hidden !important;
+	}
+
+	body.jf-page-stats .value {
+		font-size: clamp(28px, 4cqw, 56px) !important;
+	}
+
+	body.jf-page-stats .panel pre {
+		font-size: clamp(7px, .8cqw, 11px) !important;
+		line-height: 1.02 !important;
+	}
+}
+
+/* ==================================================
+   LIVE TITLE STRONGER
+================================================== */
+
+.liveDirection,
+.flightDirection,
+.approachLabel{
+	font-size: clamp(26px, 2.1cqw, 42px) !important;
+	font-weight: 700 !important;
+	line-height: 1.05 !important;
+	letter-spacing: -.01em !important;
+}
+
+
+/* ==================================================
+   NO FLIGHT CLEANUP 2026-05-17
+================================================== */
+
+/* Kein Flug: Flight-Überschrift, Logo-Kreis und Airline-Zeile weg */
+
+/* Kein Flug: Info-Bereich nicht künstlich mit leerem Content füllen */
+
+/* Runway-Text unten in Info-Bereich als grüne Pille */
+
+
+/* gelbe Fenster-Pille bei kein Flug weg */
+
+/* Runway Text IM Bild ausblenden, damit er nicht doppelt ist */
+
+/* Warte-Text im Bild alleine mittig unten */
+
+/* Wenn Flug da ist: Placeholder/Radar komplett aus */
+body:not(.jf-no-flight) #placeholder,
+body:not(.jf-no-flight) .placeholder,
+body:not(.jf-no-flight) .radarCircle,
+body:not(.jf-no-flight) .radarSweep,
+body:not(.jf-no-flight) .idlePlane,
+body:not(.jf-no-flight) .idleText,
+body:not(.jf-no-flight) .idleRunwayText{
+	display:none !important;
+	opacity:0 !important;
+	pointer-events:none !important;
+}
+
+
+/* ======================================================
+   HEATMAP FINAL: Top Airlines / Top Routen größer
+====================================================== */
+
+body.jf-page-heatmap .topBox,
+body.jf-page-heatmap .topListBox,
+body.jf-page-heatmap .summaryBox{
+	container-type:inline-size;
+}
+
+body.jf-page-heatmap .topBox h3,
+body.jf-page-heatmap .topListBox h3,
+body.jf-page-heatmap .summaryBox h3{
+	font-size:clamp(18px, 5.4cqw, 26px) !important;
+	line-height:1.05 !important;
+}
+
+body.jf-page-heatmap .topBox,
+body.jf-page-heatmap .topBox *,
+body.jf-page-heatmap .topListBox,
+body.jf-page-heatmap .topListBox *,
+body.jf-page-heatmap .summaryBox,
+body.jf-page-heatmap .summaryBox *{
+	font-size:clamp(17px, 5.0cqw, 24px) !important;
+	line-height:1.18 !important;
+}
+
+@media (orientation:landscape){
+	body.jf-page-heatmap .topBox h3,
+	body.jf-page-heatmap .topListBox h3,
+	body.jf-page-heatmap .summaryBox h3{
+		font-size:clamp(16px, 2.0cqw, 24px) !important;
+	}
+
+	body.jf-page-heatmap .topBox,
+	body.jf-page-heatmap .topBox *,
+	body.jf-page-heatmap .topListBox,
+	body.jf-page-heatmap .topListBox *,
+	body.jf-page-heatmap .summaryBox,
+	body.jf-page-heatmap .summaryBox *{
+		font-size:clamp(15px, 1.7cqw, 22px) !important;
+		line-height:1.16 !important;
+	}
+}
+
+/* ======================================================
+   STATS FINAL: echte Textspalten stabil
+====================================================== */
+
+.panel.jf-split-panel pre{
+	display:grid !important;
+	grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
+	column-gap:22px !important;
+	row-gap:2px !important;
+
+	margin:0 !important;
+	white-space:normal !important;
+
+	font-size:clamp(13px, 1.55cqw, 19px) !important;
+	line-height:1.14 !important;
+	font-weight:800 !important;
+}
+
+.panel.jf-split-panel pre .jf-line{
+	display:block !important;
+	min-width:0 !important;
+	white-space:nowrap !important;
+	overflow:hidden !important;
+	text-overflow:ellipsis !important;
+}
+
+@media (orientation:landscape){
+	.panel.jf-split-panel pre{
+		grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
+		column-gap:24px !important;
+		font-size:clamp(10px, .9cqw, 14px) !important;
+		line-height:1.08 !important;
+	}
+}
+
+
+
+/* ======================================================
+   FRAME PAGE CLEAN V1
+   Nur frame.html. Globale JetFrame-Basis bleibt erhalten.
+====================================================== */
+
+html,
+body.jf-page-frame{
+	width:100%;
+	height:100%;
+	margin:0;
+	overflow:hidden;
+}
+
+body.jf-page-frame{
+	min-height:100dvh;
+	background:
+		radial-gradient(circle at 18% 8%, rgba(50,120,255,.22), transparent 34%),
+		radial-gradient(circle at 86% 12%, rgba(255,130,55,.13), transparent 30%),
+		linear-gradient(180deg,#111827 0%,#05060a 76%);
+}
+
+body.jf-page-frame #app{
+	width:100vw;
+	height:100dvh;
+	padding:calc(env(safe-area-inset-top) + clamp(8px, 1.8vmin, 18px))
+	        calc(env(safe-area-inset-right) + clamp(8px, 1.8vmin, 18px))
+	        calc(env(safe-area-inset-bottom) + clamp(8px, 1.8vmin, 18px))
+	        calc(env(safe-area-inset-left) + clamp(8px, 1.8vmin, 18px));
+	overflow:hidden;
+}
+
+body.jf-page-frame #wall.jf-shell{
+	width:100%;
+	height:100%;
+	max-width:none;
+	max-height:none;
+	margin:0;
+	overflow:hidden;
+	border-radius:clamp(26px, 4vmin, 44px);
+	display:grid;
+	grid-template-rows:auto minmax(0, 1fr);
+	gap:clamp(10px, 1.5vmin, 18px);
+	padding:clamp(12px, 1.8vmin, 24px);
+}
+
+body.jf-page-frame .header{
+	min-height:auto;
+	display:grid;
+	grid-template-columns:auto minmax(0, 1fr) auto;
+	align-items:center;
+	gap:clamp(10px, 1.4vmin, 18px);
+}
+
+body.jf-page-frame .headerTitleBlock{
+	min-width:0;
+}
+
+body.jf-page-frame .title{
+	white-space:nowrap;
+	line-height:.95;
+}
+
+body.jf-page-frame .sub{
+	white-space:nowrap;
+}
+
+body.jf-page-frame .frameHeaderActions{
+	display:flex;
+	align-items:center;
+	justify-content:flex-end;
+	gap:clamp(8px, 1.2vmin, 14px);
+}
+
+body.jf-page-frame #toggleBtn,
+body.jf-page-frame .jfHiddenToggle{
+	display:none !important;
+}
+
+body.jf-page-frame .jfFrameMain{
+	position:relative;
+	min-height:0;
+	height:100%;
+	display:grid;
+	gap:clamp(10px, 1.5vmin, 18px);
+	grid-template-areas:
+		"photo"
+		"info"
+		"metrics";
+	grid-template-rows:minmax(230px, 42%) minmax(0, 1fr) auto;
+}
+
+body.jf-page-frame .photoWrap{
+	grid-area:photo;
+	position:relative;
+	min-height:0;
+	overflow:hidden;
+	border-radius:clamp(22px, 3vmin, 36px);
+	border:1px solid rgba(255,255,255,.18);
+	background:rgba(255,255,255,.06);
+}
+
+body.jf-page-frame #planePhoto{
+	width:100%;
+	height:100%;
+	object-fit:cover;
+	display:none;
+}
+
+body.jf-page-frame #placeholder{
+	position:absolute;
+	inset:0;
+	display:grid;
+	place-items:center;
+	overflow:hidden;
+}
+
+body.jf-page-frame .info{
+	grid-area:info;
+	min-height:0;
+	overflow:hidden;
+	display:flex;
+	flex-direction:column;
+	align-items:flex-start;
+	gap:clamp(5px, .9vmin, 11px);
+}
+
+body.jf-page-frame .mode{
+	font-size:clamp(22px, 3.4vmin, 42px);
+	font-weight:900;
+	line-height:1;
+}
+
+body.jf-page-frame .flightInfoPillRow{
+	display:flex;
+	align-items:center;
+	gap:clamp(8px, 1.2vmin, 14px);
+	flex-wrap:wrap;
+}
+
+body.jf-page-frame .windowInfo,
+body.jf-page-frame .runwayInfo{
+	display:none;
+	align-items:center;
+	gap:8px;
+	border-radius:999px;
+	padding:clamp(7px, 1vmin, 11px) clamp(12px, 1.6vmin, 20px);
+	font-size:clamp(14px, 2vmin, 24px);
+	font-weight:900;
+	white-space:nowrap;
+}
+
+body.jf-page-frame .runwayInfo.visible,
+body.jf-page-frame .windowInfo.visible{
+	display:inline-flex;
+}
+
+body.jf-page-frame .iataCallsign{
+	font-size:clamp(42px, 7vmin, 82px);
+	font-weight:950;
+	letter-spacing:-.07em;
+	line-height:.92;
+	white-space:nowrap;
+}
+
+body.jf-page-frame .operatorCallsign,
+body.jf-page-frame .routeCodes,
+body.jf-page-frame .reg{
+	font-size:clamp(18px, 2.7vmin, 32px);
+	font-weight:700;
+	color:rgba(255,255,255,.62);
+	letter-spacing:-.035em;
+}
+
+body.jf-page-frame .routeCities{
+	font-size:clamp(32px, 5.3vmin, 66px);
+	font-weight:950;
+	letter-spacing:-.07em;
+	line-height:.98;
+	white-space:nowrap;
+	max-width:100%;
+	overflow:hidden;
+	text-overflow:ellipsis;
+}
+
+body.jf-page-frame #aircraftCard.aircraftCard{
+	margin-top:clamp(5px, .9vmin, 12px);
+	display:grid;
+	grid-template-columns:auto 1px auto auto auto;
+	align-items:center;
+	gap:clamp(8px, 1.15vmin, 15px);
+	max-width:100%;
+	border-radius:clamp(22px, 3vmin, 34px);
+	border:1px solid rgba(255,255,255,.16);
+	background:rgba(255,255,255,.075);
+	padding:clamp(9px, 1.35vmin, 16px) clamp(12px, 1.8vmin, 22px);
+}
+
+body.jf-page-frame #airlineMini,
+body.jf-page-frame #manufacturerLogo{
+	display:inline-flex;
+	align-items:center;
+	gap:clamp(8px, 1.1vmin, 13px);
+	min-width:0;
+}
+
+body.jf-page-frame #airlineLogoImg,
+body.jf-page-frame #manufacturerLogoImg,
+body.jf-page-frame #manufacturerLogoText{
+	width:clamp(28px, 4vmin, 46px);
+	height:clamp(28px, 4vmin, 46px);
+	border-radius:999px;
+	object-fit:contain;
+	flex:0 0 auto;
+}
+
+body.jf-page-frame #airline,
+body.jf-page-frame #aircraftTypeText,
+body.jf-page-frame #aircraftSize{
+	font-size:clamp(18px, 2.6vmin, 32px);
+	font-weight:900;
+	letter-spacing:-.04em;
+	white-space:nowrap;
+}
+
+body.jf-page-frame #aircraftSize{
+	color:#ffe77a;
+}
+
+body.jf-page-frame .aircraftSep{
+	width:1px;
+	height:clamp(28px, 4vmin, 48px);
+	background:rgba(255,255,255,.16);
+}
+
+body.jf-page-frame .special{
+	display:none;
+}
+
+body.jf-page-frame .metrics{
+	grid-area:metrics;
+	display:grid;
+	grid-template-columns:repeat(4, minmax(0, 1fr));
+	gap:clamp(8px, 1.3vmin, 16px);
+	min-height:clamp(58px, 8.8vmin, 96px);
+}
+
+body.jf-page-frame .metric{
+	min-width:0;
+}
+
+body.jf-page-frame .metricValue{
+	font-size:clamp(27px, 4.8vmin, 56px);
+	line-height:.9;
+	white-space:nowrap;
+}
+
+body.jf-page-frame .metricLabel{
+	white-space:nowrap;
+}
+
+/* Idle Runway Pill */
+body.jf-page-frame #idleRunwayText.idleRunwayText{
+	display:none;
+	position:absolute;
+	left:50%;
+	bottom:clamp(12px, 2.2vmin, 28px);
+	transform:translateX(-50%);
+	max-width:90%;
+	border-radius:999px;
+	padding:clamp(8px, 1.2vmin, 13px) clamp(14px, 1.8vmin, 22px);
+	background:rgba(50,232,121,.15);
+	border:1px solid rgba(50,232,121,.32);
+	color:#dffff0;
+	font-weight:850;
+	white-space:nowrap;
+	z-index:4;
+}
+
+body.jf-page-frame #idleRunwayText.idleRunwayText.visible{
+	display:inline-flex;
+}
+
+/* No Flight */
+body.jf-page-frame.jf-no-flight .info .callsigns,
+body.jf-page-frame.jf-no-flight .routeBig,
+body.jf-page-frame.jf-no-flight #aircraftCard,
+body.jf-page-frame.jf-no-flight .reg,
+body.jf-page-frame.jf-no-flight .flightInfoPillRow{
+	display:none !important;
+}
+
+/* Preload Overlay */
+body.jf-page-frame .jfPreloadOverlay{
+	position:absolute;
+	inset:0;
+	z-index:30;
+	pointer-events:none;
+	display:grid;
+	gap:clamp(10px, 1.5vmin, 18px);
+	grid-template-areas:
+		"prePhoto"
+		"preInfo"
+		"preMetrics";
+	grid-template-rows:minmax(230px, 42%) minmax(0, 1fr) auto;
+	opacity:0;
+	visibility:hidden;
+	transition:opacity .18s ease, visibility .18s ease;
+}
+
+body.jf-page-frame.jf-preload .jfPreloadOverlay{
+	opacity:1;
+	visibility:visible;
+}
+
+body.jf-page-frame.jf-preload .photoWrap > *,
+body.jf-page-frame.jf-preload .info > *,
+body.jf-page-frame.jf-preload .metrics > *{
+	opacity:0 !important;
+}
+
+body.jf-page-frame .prePhoto{
+	grid-area:prePhoto;
+	border-radius:clamp(22px, 3vmin, 36px);
+	border:1px solid rgba(255,255,255,.18);
+	background:rgba(255,255,255,.06);
+}
+
+body.jf-page-frame .preInfo{
+	grid-area:preInfo;
+	display:flex;
+	flex-direction:column;
+	align-items:flex-start;
+	gap:clamp(8px, 1.05vmin, 13px);
+	overflow:hidden;
+}
+
+body.jf-page-frame .preMetrics{
+	grid-area:preMetrics;
+	display:grid;
+	grid-template-columns:repeat(4, minmax(0, 1fr));
+	gap:clamp(8px, 1.3vmin, 16px);
+	min-height:clamp(58px, 8.8vmin, 96px);
+}
+
+body.jf-page-frame .sk{
+	display:block;
+	border-radius:999px;
+	background:linear-gradient(110deg, rgba(255,255,255,.10), rgba(255,255,255,.35), rgba(255,255,255,.10));
+	background-size:240% 100%;
+	animation:jfFrameSkeleton 1.12s ease-in-out infinite;
+}
+
+body.jf-page-frame .skMode{width:min(360px,46%);height:clamp(26px,3.4vmin,42px)}
+body.jf-page-frame .prePillRow{display:flex;gap:clamp(8px,1.2vmin,14px)}
+body.jf-page-frame .skPillA{width:clamp(190px,28vmin,320px);height:clamp(34px,4.8vmin,52px)}
+body.jf-page-frame .skPillB{width:clamp(120px,17vmin,190px);height:clamp(34px,4.8vmin,52px)}
+body.jf-page-frame .skCall{width:min(340px,42%);height:clamp(42px,6.8vmin,82px)}
+body.jf-page-frame .skSmall{width:min(230px,28%);height:clamp(19px,2.8vmin,34px)}
+body.jf-page-frame .skRoute{width:min(720px,86%);height:clamp(34px,5.2vmin,66px)}
+body.jf-page-frame .skCodes{width:min(260px,35%);height:clamp(18px,2.8vmin,34px)}
+body.jf-page-frame .skReg{width:min(380px,48%);height:clamp(18px,2.7vmin,32px)}
+
+body.jf-page-frame .preCard{
+	width:min(620px,70%);
+	border-radius:clamp(22px,3vmin,34px);
+	border:1px solid rgba(255,255,255,.16);
+	background:rgba(255,255,255,.075);
+	padding:clamp(9px, 1.35vmin, 16px) clamp(12px, 1.8vmin, 22px);
+	display:grid;
+	gap:clamp(8px,1.15vmin,14px);
+}
+
+body.jf-page-frame .preCardRow{
+	display:grid;
+	grid-template-columns:clamp(28px,4vmin,46px) minmax(0,1fr) auto;
+	align-items:center;
+	gap:clamp(8px,1.15vmin,15px);
+}
+
+body.jf-page-frame .preLogo{
+	width:clamp(28px,4vmin,46px);
+	height:clamp(28px,4vmin,46px);
+	border-radius:999px;
+	background:rgba(255,255,255,.22);
+}
+
+body.jf-page-frame .preDivider{
+	height:1px;
+	background:rgba(255,255,255,.16);
+}
+
+body.jf-page-frame .skAirline{width:55%;height:clamp(16px,2.6vmin,32px)}
+body.jf-page-frame .skType{width:70%;height:clamp(16px,2.6vmin,32px)}
+body.jf-page-frame .skSize{width:clamp(90px,12vmin,150px);height:clamp(16px,2.4vmin,28px)}
+
+body.jf-page-frame .preMetric{
+	border-radius:clamp(19px,2.8vmin,30px);
+	border:1px solid rgba(255,255,255,.18);
+	background:rgba(255,255,255,.075);
+	display:grid;
+	place-items:center;
+	align-content:center;
+}
+
+body.jf-page-frame .preMetric .sk{
+	width:48%;
+	height:clamp(14px,2.1vmin,24px);
+}
+
+@media (orientation:landscape){
+	body.jf-page-frame .jfFrameMain,
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-columns:minmax(0, 47%) minmax(0, 1fr);
+		grid-template-rows:minmax(0, 1fr) auto;
+		grid-template-areas:
+			"photo info"
+			"metrics metrics";
+	}
+
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-areas:
+			"prePhoto preInfo"
+			"preMetrics preMetrics";
+	}
+
+	body.jf-page-frame .info,
+	body.jf-page-frame .preInfo{
+		padding-top:clamp(2px,.5vmin,8px);
+	}
+
+	body.jf-page-frame #aircraftCard.aircraftCard{
+		width:max-content;
+		max-width:100%;
+	}
+}
+
+@keyframes jfFrameSkeleton{
+	0%{background-position:120% 0;opacity:.55}
+	50%{opacity:1}
+	100%{background-position:-120% 0;opacity:.55}
+}
+
+
+
+/* ======================================================
+   FRAME PATCH: Window/Runway Pills + Special Pill
+====================================================== */
+
+body.jf-page-frame .windowInfo,
+body.jf-page-frame .runwayInfo{
+	display:inline-flex;
+	align-items:center;
+	gap:8px;
+	border-radius:999px;
+	padding:clamp(7px, 1vmin, 11px) clamp(13px, 1.7vmin, 21px);
+	font-weight:900;
+	white-space:nowrap;
+	border:1px solid rgba(255,255,255,.18);
+	background:rgba(255,255,255,.08);
+	color:rgba(255,255,255,.78);
+}
+
+body.jf-page-frame .windowInfo{
+	border-color:rgba(255,231,122,.34);
+	background:rgba(255,231,122,.13);
+	color:#fff0a2;
+}
+
+body.jf-page-frame .runwayInfo{
+	border-color:rgba(255,255,255,.18);
+	background:rgba(255,255,255,.08);
+	color:rgba(255,255,255,.78);
+}
+
+body.jf-page-frame .special{
+	display:none;
+	margin-top:clamp(4px, .8vmin, 10px);
+	border-radius:999px;
+	padding:clamp(8px, 1.1vmin, 12px) clamp(14px, 1.8vmin, 22px);
+	border:1px solid rgba(255,231,122,.36);
+	background:rgba(255,231,122,.14);
+	color:#fff0a2;
+	font-size:clamp(15px, 2.1vmin, 25px);
+	font-weight:900;
+	white-space:nowrap;
+}
+
+body.jf-page-frame .special:not(:empty){
+	display:inline-flex;
+	align-items:center;
+}
+
+body.jf-page-frame .special.emergency{
+	border-color:rgba(255,77,94,.42);
+	background:rgba(255,77,94,.16);
+	color:#ffd2d7;
+}
+
+
+/* ======================================================
+   FRAME PATCH: Speaker rund + Metrics zentriert
+====================================================== */
+
+body.jf-page-frame #speechBtn.speechBtn{
+	width:clamp(42px, 5.2vmin, 58px) !important;
+	min-width:clamp(42px, 5.2vmin, 58px) !important;
+	height:clamp(42px, 5.2vmin, 58px) !important;
+	padding:0 !important;
+	border-radius:999px !important;
+	display:grid !important;
+	place-items:center !important;
+	line-height:1 !important;
+	aspect-ratio:1 / 1 !important;
+	background:rgba(255,255,255,.08) !important;
+	border:1px solid rgba(255,255,255,.18) !important;
+}
+
+body.jf-page-frame #speechBtn.speechBtn.on{
+	background:rgba(255,255,255,.08) !important;
+	border-color:rgba(255,255,255,.18) !important;
+}
+
+body.jf-page-frame .metrics{
+	align-items:stretch !important;
+}
+
+body.jf-page-frame .metric{
+	display:grid !important;
+	place-items:center !important;
+	align-content:center !important;
+	justify-items:center !important;
+	text-align:center !important;
+	padding:clamp(7px, 1.1vmin, 12px) !important;
+}
+
+body.jf-page-frame .metricValue{
+	width:100% !important;
+	text-align:center !important;
+	justify-self:center !important;
+	align-self:center !important;
+	margin:0 auto !important;
+}
+
+body.jf-page-frame .metricLabel{
+	width:100% !important;
+	text-align:center !important;
+	justify-self:center !important;
+	margin-left:0 !important;
+	margin-right:0 !important;
+}
+
+
+/* ======================================================
+   FRAME PATCH: kompakter + Speaker rund + Metrics sauber
+====================================================== */
+
+/* alles etwas kleiner, damit Special noch Platz hat */
+body.jf-page-frame .jfFrameMain{
+	grid-template-rows:minmax(210px, 39%) minmax(0, 1fr) auto !important;
+	gap:clamp(8px, 1.15vmin, 14px) !important;
+}
+
+body.jf-page-frame .photoWrap{
+	border-radius:clamp(20px, 2.6vmin, 32px) !important;
+}
+
+body.jf-page-frame .info{
+	gap:clamp(3px, .65vmin, 8px) !important;
+}
+
+body.jf-page-frame .mode{
+	font-size:clamp(20px, 3.0vmin, 36px) !important;
+}
+
+body.jf-page-frame .iataCallsign{
+	font-size:clamp(36px, 6.1vmin, 70px) !important;
+	line-height:.9 !important;
+}
+
+body.jf-page-frame .routeCities{
+	font-size:clamp(28px, 4.7vmin, 56px) !important;
+	line-height:.94 !important;
+}
+
+body.jf-page-frame .operatorCallsign,
+body.jf-page-frame .routeCodes,
+body.jf-page-frame .reg{
+	font-size:clamp(16px, 2.35vmin, 28px) !important;
+}
+
+body.jf-page-frame .windowInfo,
+body.jf-page-frame .runwayInfo{
+	font-size:clamp(13px, 1.75vmin, 21px) !important;
+	padding:clamp(6px, .85vmin, 9px) clamp(11px, 1.45vmin, 17px) !important;
+}
+
+body.jf-page-frame #aircraftCard.aircraftCard{
+	width:min(560px, 70%) !important;
+	padding:clamp(8px, 1.1vmin, 13px) clamp(12px, 1.5vmin, 18px) !important;
+	border-radius:clamp(20px, 2.6vmin, 30px) !important;
+}
+
+body.jf-page-frame #airline,
+body.jf-page-frame #aircraftTypeText,
+body.jf-page-frame #aircraftSize{
+	font-size:clamp(16px, 2.25vmin, 27px) !important;
+}
+
+body.jf-page-frame #airlineLogoImg,
+body.jf-page-frame #manufacturerLogoImg,
+body.jf-page-frame #manufacturerLogoText{
+	width:clamp(25px, 3.5vmin, 40px) !important;
+	height:clamp(25px, 3.5vmin, 40px) !important;
+}
+
+body.jf-page-frame .special{
+	font-size:clamp(14px, 1.9vmin, 23px) !important;
+	padding:clamp(6px, .85vmin, 10px) clamp(12px, 1.5vmin, 18px) !important;
+}
+
+/* Speaker komplett unabhängig vom Toggle-Button */
+body.jf-page-frame #speechBtn,
+body.jf-page-frame #speechBtn.toggleBtn,
+body.jf-page-frame #speechBtn.speechBtn,
+body.jf-page-frame #speechBtn.toggleBtn.on,
+body.jf-page-frame #speechBtn.speechBtn.on{
+	width:clamp(40px, 4.7vmin, 52px) !important;
+	min-width:clamp(40px, 4.7vmin, 52px) !important;
+	height:clamp(40px, 4.7vmin, 52px) !important;
+	min-height:clamp(40px, 4.7vmin, 52px) !important;
+	padding:0 !important;
+	border-radius:999px !important;
+	aspect-ratio:1 / 1 !important;
+	display:grid !important;
+	place-items:center !important;
+	background:rgba(255,255,255,.08) !important;
+	border:1px solid rgba(255,255,255,.18) !important;
+	box-shadow:none !important;
+	color:#fff !important;
+	font-size:clamp(18px, 2.35vmin, 26px) !important;
+	line-height:1 !important;
+}
+
+/* Metrics kleiner und Inhalt wirklich mittig */
+body.jf-page-frame .metrics{
+	min-height:clamp(54px, 7.8vmin, 84px) !important;
+	gap:clamp(7px, 1.05vmin, 13px) !important;
+}
+
+body.jf-page-frame .metric{
+	min-height:clamp(54px, 7.8vmin, 84px) !important;
+	padding:clamp(5px, .8vmin, 9px) !important;
+	display:flex !important;
+	flex-direction:column !important;
+	align-items:center !important;
+	justify-content:center !important;
+	text-align:center !important;
+}
+
+body.jf-page-frame .metricValue{
+	font-size:clamp(24px, 4.1vmin, 46px) !important;
+	line-height:.88 !important;
+	width:100% !important;
+	text-align:center !important;
+	margin:0 !important;
+	letter-spacing:-.06em !important;
+}
+
+body.jf-page-frame .metricLabel{
+	font-size:clamp(8px, 1.05vmin, 12px) !important;
+	line-height:1 !important;
+	letter-spacing:.22em !important;
+	width:100% !important;
+	text-align:center !important;
+	margin-top:clamp(3px, .45vmin, 5px) !important;
+	padding-left:.22em !important;
+}
+
+/* Portrait noch etwas Luft unten */
+@media (orientation:portrait){
+	body.jf-page-frame #wall.jf-shell{
+		padding-bottom:clamp(14px, 2vmin, 24px) !important;
+	}
+
+	body.jf-page-frame .jfFrameMain{
+		grid-template-rows:minmax(200px, 38%) minmax(0, 1fr) auto !important;
+	}
+}
+
+
+/* ======================================================
+   FRAME PATCH: Speaker wie Live-Höhe + Preload synchron
+====================================================== */
+
+/* Speaker exakt gleiche Höhe wie Live-Pill, aber rund */
+body.jf-page-frame #speechBtn,
+body.jf-page-frame #speechBtn.toggleBtn,
+body.jf-page-frame #speechBtn.speechBtn,
+body.jf-page-frame #speechBtn.toggleBtn.on,
+body.jf-page-frame #speechBtn.speechBtn.on{
+	width:clamp(38px, 4.2vmin, 48px) !important;
+	min-width:clamp(38px, 4.2vmin, 48px) !important;
+	height:clamp(38px, 4.2vmin, 48px) !important;
+	min-height:clamp(38px, 4.2vmin, 48px) !important;
+	padding:0 !important;
+	border-radius:999px !important;
+	aspect-ratio:1 / 1 !important;
+	display:grid !important;
+	place-items:center !important;
+	font-size:clamp(17px, 2.05vmin, 23px) !important;
+	line-height:1 !important;
+}
+
+/* Preload bekommt exakt die gleiche neue Kompakt-Aufteilung wie echtes Layout */
+body.jf-page-frame .jfPreloadOverlay{
+	grid-template-rows:minmax(200px, 38%) minmax(0, 1fr) auto !important;
+	gap:clamp(8px, 1.15vmin, 14px) !important;
+}
+
+body.jf-page-frame .prePhoto{
+	border-radius:clamp(20px, 2.6vmin, 32px) !important;
+}
+
+body.jf-page-frame .preInfo{
+	gap:clamp(3px, .65vmin, 8px) !important;
+}
+
+body.jf-page-frame .skMode{
+	height:clamp(20px, 3.0vmin, 36px) !important;
+	width:min(330px, 46%) !important;
+}
+
+body.jf-page-frame .skPillA,
+body.jf-page-frame .skPillB{
+	height:clamp(30px, 4.0vmin, 44px) !important;
+}
+
+body.jf-page-frame .skPillA{ width:clamp(180px, 25vmin, 290px) !important; }
+body.jf-page-frame .skPillB{ width:clamp(110px, 15vmin, 170px) !important; }
+
+body.jf-page-frame .skCall{
+	height:clamp(36px, 6.1vmin, 70px) !important;
+	width:min(310px, 42%) !important;
+}
+
+body.jf-page-frame .skRoute{
+	height:clamp(28px, 4.7vmin, 56px) !important;
+	width:min(640px, 86%) !important;
+}
+
+body.jf-page-frame .skSmall,
+body.jf-page-frame .skCodes,
+body.jf-page-frame .skReg{
+	height:clamp(16px, 2.35vmin, 28px) !important;
+}
+
+body.jf-page-frame .preCard{
+	width:min(560px, 70%) !important;
+	padding:clamp(8px, 1.1vmin, 13px) clamp(12px, 1.5vmin, 18px) !important;
+	border-radius:clamp(20px, 2.6vmin, 30px) !important;
+}
+
+body.jf-page-frame .preLogo{
+	width:clamp(25px, 3.5vmin, 40px) !important;
+	height:clamp(25px, 3.5vmin, 40px) !important;
+}
+
+body.jf-page-frame .skAirline,
+body.jf-page-frame .skType{
+	height:clamp(16px, 2.25vmin, 27px) !important;
+}
+
+body.jf-page-frame .skSize{
+	height:clamp(16px, 2.25vmin, 27px) !important;
+	width:clamp(80px, 11vmin, 130px) !important;
+}
+
+body.jf-page-frame .preMetrics{
+	min-height:clamp(54px, 7.8vmin, 84px) !important;
+	gap:clamp(7px, 1.05vmin, 13px) !important;
+}
+
+body.jf-page-frame .preMetric{
+	min-height:clamp(54px, 7.8vmin, 84px) !important;
+}
+
+body.jf-page-frame .preMetric .sk{
+	height:clamp(12px, 1.8vmin, 20px) !important;
+	width:45% !important;
+}
+
+@media (orientation:portrait){
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-rows:minmax(200px, 38%) minmax(0, 1fr) auto !important;
+	}
+}
+
+
+
+/* ======================================================
+   FRAME PATCH: Warte-auf-Flug sauber V2
+====================================================== */
+
+body.jf-page-frame .frameIdleRunwaySlot{
+	grid-area:info;
+	display:none;
+	align-items:center;
+	justify-content:center;
+	width:100%;
+	margin:0 0 clamp(6px, .9vmin, 10px) 0;
+	z-index:4;
+}
+
+body.jf-page-frame.jf-no-flight .frameIdleRunwaySlot{
+	display:flex !important;
+}
+
+body.jf-page-frame #idleRunwayText.idleRunwayText{
+	position:relative !important;
+	left:auto !important;
+	right:auto !important;
+	top:auto !important;
+	bottom:auto !important;
+	transform:none !important;
+	display:none;
+	max-width:92%;
+	border-radius:999px;
+	padding:clamp(8px, 1.1vmin, 13px) clamp(16px, 1.9vmin, 24px);
+	background:rgba(50,232,121,.16);
+	border:1px solid rgba(50,232,121,.36);
+	color:#dffff0;
+	font-weight:900;
+	white-space:nowrap;
+	text-align:center;
+}
+
+body.jf-page-frame.jf-no-flight #idleRunwayText.idleRunwayText.visible{
+	display:inline-flex !important;
+	align-items:center;
+	justify-content:center;
+}
+
+/* Wartezustand: keine leeren Fake-Daten */
+body.jf-page-frame.jf-no-flight .info{
+	align-items:center !important;
+	text-align:center !important;
+	justify-content:flex-start !important;
+}
+
+body.jf-page-frame.jf-no-flight .info > :not(#mode){
+	display:none !important;
+}
+
+body.jf-page-frame.jf-no-flight .metrics{
+	display:none !important;
+}
+
+body.jf-page-frame.jf-no-flight #mode{
+	margin-top:clamp(6px, 1vmin, 12px) !important;
+	font-size:clamp(24px, 3.5vmin, 42px) !important;
+}
+
+/* Wartezustand: Foto bleibt Radar/Animation */
+body.jf-page-frame.jf-no-flight #planePhoto{
+	display:none !important;
+	opacity:0 !important;
+	visibility:hidden !important;
+}
+
+body.jf-page-frame.jf-no-flight #placeholder{
+	display:grid !important;
+	opacity:1 !important;
+	visibility:visible !important;
+	background:
+		radial-gradient(circle at 50% 45%, rgba(255,255,255,.08), transparent 34%),
+		linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.025)) !important;
+}
+
+body.jf-page-frame.jf-no-flight .radarCircle{
+	position:absolute;
+	width:min(48vmin, 360px);
+	aspect-ratio:1;
+	border-radius:999px;
+	border:1px solid rgba(255,255,255,.15);
+	box-shadow:
+		0 0 0 11vmin rgba(255,255,255,.018),
+		0 0 0 22vmin rgba(255,255,255,.012);
+}
+
+body.jf-page-frame.jf-no-flight .radarSweep{
+	position:absolute;
+	width:min(48vmin, 360px);
+	aspect-ratio:1;
+	border-radius:999px;
+	background:conic-gradient(from 0deg, rgba(50,232,121,.30), transparent 18%, transparent);
+	animation:jfRadarSpin2 2.8s linear infinite;
+	opacity:.42;
+}
+
+body.jf-page-frame.jf-no-flight .idlePlane{
+	position:relative;
+	z-index:3;
+	font-size:clamp(42px, 7vmin, 78px);
+	filter:drop-shadow(0 10px 24px rgba(0,0,0,.35));
+}
+
+body.jf-page-frame .idleFlyers{
+	display:none;
+}
+
+body.jf-page-frame.jf-no-flight .idleFlyers{
+	display:block;
+	position:absolute;
+	inset:0;
+	pointer-events:none;
+	overflow:hidden;
+	z-index:2;
+}
+
+body.jf-page-frame.jf-no-flight .idleFlyers span{
+	position:absolute;
+	left:-14%;
+	font-size:clamp(20px, 3.2vmin, 34px);
+	opacity:0;
+	filter:drop-shadow(0 8px 18px rgba(0,0,0,.35));
+	animation:jfIdleFly2 5.8s ease-in-out infinite;
+}
+
+body.jf-page-frame.jf-no-flight .idleFlyers span:nth-child(1){ top:30%; animation-delay:.2s; }
+body.jf-page-frame.jf-no-flight .idleFlyers span:nth-child(2){ top:58%; animation-delay:1.8s; }
+body.jf-page-frame.jf-no-flight .idleFlyers span:nth-child(3){ top:44%; animation-delay:3.4s; }
+
+body.jf-page-frame.jf-no-flight .idleText{
+	position:absolute;
+	left:50%;
+	bottom:clamp(16px, 2.5vmin, 32px);
+	transform:translateX(-50%);
+	font-weight:850;
+	font-size:clamp(18px, 2.5vmin, 28px);
+	color:rgba(255,255,255,.72);
+	white-space:nowrap;
+	z-index:3;
+}
+
+@keyframes jfRadarSpin2{
+	to{ transform:rotate(360deg); }
+}
+
+@keyframes jfIdleFly2{
+	0%{ transform:translateX(0) translateY(20px) rotate(8deg); opacity:0; }
+	12%{ opacity:.85; }
+	82%{ opacity:.85; }
+	100%{ transform:translateX(115vw) translateY(-38px) rotate(8deg); opacity:0; }
+}
+
+/* ======================================================
+   FRAME PATCH: sauberer Übergang Warteanimation -> Flug
+====================================================== */
+
+/* Sobald echter Flug erkannt:
+   Radar sofort weg
+   aber Skeleton darf bleiben */
+body.jf-page-frame.jf-preload:not(.jf-no-flight) #placeholder{
+	opacity:0 !important;
+	visibility:hidden !important;
+	pointer-events:none !important;
+	transition:
+		opacity .22s ease,
+		visibility .22s ease !important;
+}
+
+/* Flugfoto schon weich einblenden während Skeleton noch sichtbar */
+body.jf-page-frame.jf-preload:not(.jf-no-flight) #planePhoto{
+	display:block !important;
+	opacity:.22 !important;
+	filter:blur(3px) saturate(.9);
+	transform:scale(1.01);
+	transition:
+		opacity .28s ease,
+		filter .35s ease,
+		transform .35s ease !important;
+}
+
+/* Nach preload echtes Bild vollständig */
+body.jf-page-frame.jf-loaded #planePhoto{
+	opacity:1 !important;
+	filter:none !important;
+	transform:none !important;
+}
+
+/* Skeleton etwas transparenter sobald echte Flugdaten da sind */
+body.jf-page-frame.jf-preload:not(.jf-no-flight) .jfPreloadOverlay{
+	background:
+		linear-gradient(
+			180deg,
+			rgba(5,6,10,.10),
+			rgba(5,6,10,.18)
+		) !important;
+
+	backdrop-filter:blur(2px);
+}
+
+/* Skeleton nicht mehr komplett dominant */
+body.jf-page-frame.jf-preload:not(.jf-no-flight) .sk{
+	opacity:.72 !important;
+}
+
+/* Warteanimation NUR wenn wirklich jf-no-flight */
+body.jf-page-frame:not(.jf-no-flight) .idlePlane,
+body.jf-page-frame:not(.jf-no-flight) .idleFlyers,
+body.jf-page-frame:not(.jf-no-flight) .radarCircle,
+body.jf-page-frame:not(.jf-no-flight) .radarSweep,
+body.jf-page-frame:not(.jf-no-flight) .idleText{
+	display:none !important;
+}
+
+
+/* ======================================================
+   FRAME PATCH: Querformat getrennt iPad / iPhone
+====================================================== */
+
+/* ------------------------------------------------------
+   iPad / Tablet Querformat
+   Ziel: Layout behalten, aber Metrics unten flacher
+------------------------------------------------------ */
+@media (orientation:landscape) and (min-width: 900px) and (min-height: 600px){
+
+	body.jf-page-frame #wall.jf-shell{
+		gap:clamp(8px, 1.1vmin, 14px) !important;
+	}
+
+	body.jf-page-frame .jfFrameMain,
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-columns:minmax(0, 47%) minmax(0, 1fr) !important;
+		grid-template-rows:minmax(0, 1fr) clamp(54px, 8vh, 74px) !important;
+		gap:clamp(8px, 1.1vmin, 14px) !important;
+	}
+
+	body.jf-page-frame .metrics,
+	body.jf-page-frame .preMetrics{
+		min-height:clamp(54px, 8vh, 74px) !important;
+		height:clamp(54px, 8vh, 74px) !important;
+		gap:clamp(8px, 1.1vmin, 14px) !important;
+	}
+
+	body.jf-page-frame .metric,
+	body.jf-page-frame .preMetric{
+		min-height:clamp(54px, 8vh, 74px) !important;
+		height:clamp(54px, 8vh, 74px) !important;
+		border-radius:clamp(16px, 2.1vmin, 24px) !important;
+		padding:clamp(4px, .7vmin, 8px) !important;
+	}
+
+	body.jf-page-frame .metricValue{
+		font-size:clamp(24px, 4.2vmin, 42px) !important;
+		line-height:.86 !important;
+	}
+
+	body.jf-page-frame .metricLabel{
+		font-size:clamp(7px, .95vmin, 11px) !important;
+		letter-spacing:.20em !important;
+		margin-top:clamp(2px, .35vmin, 4px) !important;
+	}
+
+	body.jf-page-frame .preMetric .sk{
+		height:clamp(10px, 1.4vmin, 16px) !important;
+	}
+}
+
+
+/* ------------------------------------------------------
+   iPhone Querformat / sehr niedrige Höhe
+   Ziel: rechte Info-Spalte deutlich kompakter
+------------------------------------------------------ */
+@media (orientation:landscape) and (max-height: 520px){
+
+	body.jf-page-frame #app{
+		padding:calc(env(safe-area-inset-top) + 6px)
+		        calc(env(safe-area-inset-right) + 8px)
+		        calc(env(safe-area-inset-bottom) + 6px)
+		        calc(env(safe-area-inset-left) + 8px) !important;
+	}
+
+	body.jf-page-frame #wall.jf-shell{
+		padding:clamp(8px, 1.6vmin, 14px) !important;
+		gap:clamp(6px, 1vmin, 10px) !important;
+		border-radius:clamp(22px, 3.2vmin, 32px) !important;
+	}
+
+	body.jf-page-frame .header{
+		gap:clamp(7px, 1.1vmin, 12px) !important;
+	}
+
+	body.jf-page-frame .title{
+		font-size:clamp(23px, 5.1vmin, 36px) !important;
+		line-height:.88 !important;
+	}
+
+	body.jf-page-frame .sub{
+		font-size:clamp(12px, 2.5vmin, 18px) !important;
+		line-height:1 !important;
+	}
+
+	body.jf-page-frame .backBtn,
+	body.jf-page-frame #speechBtn,
+	body.jf-page-frame #speechBtn.toggleBtn,
+	body.jf-page-frame #speechBtn.speechBtn{
+		width:clamp(32px, 6.2vmin, 42px) !important;
+		min-width:clamp(32px, 6.2vmin, 42px) !important;
+		height:clamp(32px, 6.2vmin, 42px) !important;
+		min-height:clamp(32px, 6.2vmin, 42px) !important;
+		font-size:clamp(15px, 3vmin, 21px) !important;
+	}
+
+	body.jf-page-frame .livePill{
+		height:clamp(32px, 6.2vmin, 42px) !important;
+		padding:0 clamp(10px, 2vmin, 16px) !important;
+		font-size:clamp(14px, 2.8vmin, 20px) !important;
+	}
+
+	body.jf-page-frame .jfFrameMain,
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-columns:minmax(0, 48%) minmax(0, 1fr) !important;
+		grid-template-rows:minmax(0, 1fr) clamp(44px, 12vh, 58px) !important;
+		gap:clamp(6px, 1vmin, 10px) !important;
+	}
+
+	body.jf-page-frame .photoWrap,
+	body.jf-page-frame .prePhoto{
+		border-radius:clamp(16px, 3vmin, 24px) !important;
+	}
+
+	body.jf-page-frame .info,
+	body.jf-page-frame .preInfo{
+		gap:clamp(2px, .65vmin, 5px) !important;
+		padding-top:0 !important;
+	}
+
+	body.jf-page-frame .mode{
+		font-size:clamp(17px, 3.3vmin, 24px) !important;
+		line-height:.95 !important;
+	}
+
+	body.jf-page-frame .windowInfo,
+	body.jf-page-frame .runwayInfo{
+		font-size:clamp(10px, 2.15vmin, 15px) !important;
+		padding:clamp(4px, .8vmin, 6px) clamp(8px, 1.5vmin, 12px) !important;
+	}
+
+	body.jf-page-frame .iataCallsign{
+		font-size:clamp(28px, 6.2vmin, 44px) !important;
+		line-height:.82 !important;
+	}
+
+	body.jf-page-frame .operatorCallsign,
+	body.jf-page-frame .routeCodes,
+	body.jf-page-frame .reg{
+		font-size:clamp(12px, 2.45vmin, 17px) !important;
+		line-height:1 !important;
+	}
+
+	body.jf-page-frame .routeCities{
+		font-size:clamp(22px, 5.1vmin, 36px) !important;
+		line-height:.86 !important;
+	}
+
+	body.jf-page-frame #aircraftCard.aircraftCard{
+		width:min(440px, 92%) !important;
+		padding:clamp(5px, 1vmin, 8px) clamp(8px, 1.5vmin, 12px) !important;
+		border-radius:clamp(15px, 2.8vmin, 22px) !important;
+		margin-top:clamp(2px, .45vmin, 4px) !important;
+	}
+
+	body.jf-page-frame #aircraftCard .aircraftSep{
+		margin:clamp(4px, .75vmin, 6px) 0 !important;
+	}
+
+	body.jf-page-frame #airlineLogoImg,
+	body.jf-page-frame #manufacturerLogoImg,
+	body.jf-page-frame #manufacturerLogoText{
+		width:clamp(20px, 4.2vmin, 28px) !important;
+		height:clamp(20px, 4.2vmin, 28px) !important;
+	}
+
+	body.jf-page-frame #airline,
+	body.jf-page-frame #aircraftTypeText,
+	body.jf-page-frame #aircraftSize{
+		font-size:clamp(13px, 2.7vmin, 19px) !important;
+		line-height:1 !important;
+	}
+
+	body.jf-page-frame #aircraftCard #aircraftTypeText{
+		margin-left:calc(clamp(20px, 4.2vmin, 28px) + 8px) !important;
+	}
+
+	body.jf-page-frame .special{
+		font-size:clamp(11px, 2.25vmin, 16px) !important;
+		padding:clamp(4px, .8vmin, 6px) clamp(8px, 1.5vmin, 12px) !important;
+	}
+
+	body.jf-page-frame .metrics,
+	body.jf-page-frame .preMetrics{
+		min-height:clamp(44px, 12vh, 58px) !important;
+		height:clamp(44px, 12vh, 58px) !important;
+		gap:clamp(6px, 1vmin, 10px) !important;
+	}
+
+	body.jf-page-frame .metric,
+	body.jf-page-frame .preMetric{
+		min-height:clamp(44px, 12vh, 58px) !important;
+		height:clamp(44px, 12vh, 58px) !important;
+		border-radius:clamp(14px, 2.6vmin, 20px) !important;
+		padding:3px !important;
+	}
+
+	body.jf-page-frame .metricValue{
+		font-size:clamp(19px, 4.7vmin, 32px) !important;
+		line-height:.82 !important;
+	}
+
+	body.jf-page-frame .metricLabel{
+		font-size:clamp(6px, 1.35vmin, 9px) !important;
+		letter-spacing:.18em !important;
+		margin-top:2px !important;
+	}
+}
+
+
+/* ======================================================
+   FRAME PATCH: Warteanzeige erst nach Preload
+====================================================== */
+
+/* zweites "Warte auf Flug" unter dem Bild entfernen */
+body.jf-page-frame.jf-no-flight .info,
+body.jf-page-frame.jf-no-flight #mode{
+	display:none !important;
+}
+
+/* grüne Runway-Pille ebenfalls erst nach Preload zeigen */
+body.jf-page-frame.jf-preload .frameIdleRunwaySlot,
+body.jf-page-frame.jf-preload #idleRunwayText{
+	display:none !important;
+}
+
+/* während Preload KEINE Radar-/Warteanimation anzeigen */
+body.jf-page-frame.jf-preload.jf-no-flight #placeholder,
+body.jf-page-frame.jf-preload.jf-no-flight .radarCircle,
+body.jf-page-frame.jf-preload.jf-no-flight .radarSweep,
+body.jf-page-frame.jf-preload.jf-no-flight .idlePlane,
+body.jf-page-frame.jf-preload.jf-no-flight .idleFlyers,
+body.jf-page-frame.jf-preload.jf-no-flight .idleText{
+	opacity:0 !important;
+	visibility:hidden !important;
+}
+
+/* nach Preload darf die Warteanimation sichtbar sein */
+body.jf-page-frame.jf-loaded.jf-no-flight #placeholder{
+	opacity:1 !important;
+	visibility:visible !important;
+}
+
+
+/* ======================================================
+   FRAME PATCH: Querformat luftiger + Speaker kleiner
+====================================================== */
+
+/* Speaker wirklich passend zur Live-Pill */
+body.jf-page-frame #speechBtn,
+body.jf-page-frame #speechBtn.toggleBtn,
+body.jf-page-frame #speechBtn.speechBtn{
+	width:clamp(34px, 4.0vmin, 44px) !important;
+	min-width:clamp(34px, 4.0vmin, 44px) !important;
+	height:clamp(34px, 4.0vmin, 44px) !important;
+	min-height:clamp(34px, 4.0vmin, 44px) !important;
+	padding:0 !important;
+	border-radius:999px !important;
+	font-size:clamp(15px, 1.9vmin, 21px) !important;
+	display:grid !important;
+	place-items:center !important;
+}
+
+/* Querformat allgemein luftiger */
+@media (orientation:landscape){
+
+	body.jf-page-frame .jfFrameMain,
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-columns:minmax(0, 46%) minmax(0, 1fr) !important;
+		gap:clamp(14px, 2.2vmin, 26px) !important;
+	}
+
+	body.jf-page-frame .info,
+	body.jf-page-frame .preInfo{
+		padding-left:clamp(4px, .8vmin, 12px) !important;
+		gap:clamp(4px, .8vmin, 9px) !important;
+	}
+
+	body.jf-page-frame .photoWrap,
+	body.jf-page-frame .prePhoto{
+		align-self:start !important;
+	}
+
+	body.jf-page-frame #aircraftCard.aircraftCard{
+		width:min(620px, 92%) !important;
+	}
+
+	body.jf-page-frame .metrics,
+	body.jf-page-frame .preMetrics{
+		height:clamp(48px, 10vh, 68px) !important;
+		min-height:clamp(48px, 10vh, 68px) !important;
+	}
+
+	body.jf-page-frame .metric,
+	body.jf-page-frame .preMetric{
+		height:clamp(48px, 10vh, 68px) !important;
+		min-height:clamp(48px, 10vh, 68px) !important;
+	}
+
+	body.jf-page-frame .metricValue{
+		font-size:clamp(22px, 4.1vmin, 38px) !important;
+	}
+
+	body.jf-page-frame .metricLabel{
+		font-size:clamp(7px, 1.05vmin, 10px) !important;
+	}
+}
+
+/* iPhone quer: nicht mehr so brutal zusammenpressen */
+@media (orientation:landscape) and (max-height: 520px){
+
+	body.jf-page-frame .jfFrameMain,
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-columns:minmax(0, 47%) minmax(0, 1fr) !important;
+		gap:clamp(10px, 1.8vmin, 18px) !important;
+	}
+
+	body.jf-page-frame .mode{
+		font-size:clamp(18px, 3.7vmin, 26px) !important;
+	}
+
+	body.jf-page-frame .iataCallsign{
+		font-size:clamp(30px, 6.6vmin, 46px) !important;
+	}
+
+	body.jf-page-frame .routeCities{
+		font-size:clamp(23px, 5.3vmin, 38px) !important;
+	}
+
+	body.jf-page-frame #aircraftCard.aircraftCard{
+		width:min(520px, 94%) !important;
+	}
+}
+
+
+/* ======================================================
+   FRAME PATCH: Querformat Höhe / Speaker final
+====================================================== */
+
+/* Speaker nochmal kleiner + optisch exakt Live-Pill */
+body.jf-page-frame #speechBtn,
+body.jf-page-frame #speechBtn.toggleBtn,
+body.jf-page-frame #speechBtn.speechBtn{
+	width:clamp(30px, 3.5vmin, 40px) !important;
+	min-width:clamp(30px, 3.5vmin, 40px) !important;
+	height:clamp(30px, 3.5vmin, 40px) !important;
+	min-height:clamp(30px, 3.5vmin, 40px) !important;
+	font-size:clamp(13px, 1.55vmin, 18px) !important;
+	padding:0 !important;
+	border-radius:999px !important;
+	display:grid !important;
+	place-items:center !important;
+}
+
+/* ------------------------------------------------------
+   Querformat allgemein
+------------------------------------------------------ */
+@media (orientation:landscape){
+
+	/* Bild wieder höher */
+	body.jf-page-frame .jfFrameMain,
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-rows:minmax(0, 1fr) clamp(54px, 9vh, 72px) !important;
+	}
+
+	body.jf-page-frame .photoWrap,
+	body.jf-page-frame .prePhoto{
+		min-height:clamp(260px, 56vh, 560px) !important;
+		max-height:none !important;
+	}
+
+	/* Textspalte etwas entspannter */
+	body.jf-page-frame .info,
+	body.jf-page-frame .preInfo{
+		padding-top:clamp(4px, .8vmin, 10px) !important;
+	}
+
+	/* Route-Zeile NICHT mehr abschneiden */
+	body.jf-page-frame .routeCities{
+		line-height:1.02 !important;
+		padding-bottom:.08em !important;
+		overflow:visible !important;
+	}
+
+	/* Callsign ebenfalls etwas luftiger */
+	body.jf-page-frame .iataCallsign{
+		line-height:.92 !important;
+		padding-bottom:.03em !important;
+	}
+
+	/* Aircraft Card minimal tiefer */
+	body.jf-page-frame #aircraftCard.aircraftCard{
+		margin-top:clamp(4px, .7vmin, 8px) !important;
+	}
+
+	/* Metrics weiterhin kompakt */
+	body.jf-page-frame .metrics,
+	body.jf-page-frame .preMetrics{
+		height:clamp(50px, 9vh, 68px) !important;
+		min-height:clamp(50px, 9vh, 68px) !important;
+	}
+}
+
+/* ------------------------------------------------------
+   iPhone Querformat
+------------------------------------------------------ */
+@media (orientation:landscape) and (max-height: 520px){
+
+	/* Bild nochmal sichtbar höher */
+	body.jf-page-frame .photoWrap,
+	body.jf-page-frame .prePhoto{
+		min-height:clamp(210px, 60vh, 360px) !important;
+	}
+
+	/* Bangkok/Frankfurt etc sauber */
+	body.jf-page-frame .routeCities{
+		line-height:1.04 !important;
+		padding-bottom:.10em !important;
+		font-size:clamp(24px, 5.5vmin, 40px) !important;
+	}
+
+	/* etwas mehr Luft unter Callsign */
+	body.jf-page-frame .iataCallsign{
+		line-height:.94 !important;
+		margin-bottom:2px !important;
+	}
+
+	/* Info insgesamt weniger gequetscht */
+	body.jf-page-frame .info,
+	body.jf-page-frame .preInfo{
+		gap:clamp(5px, .9vmin, 10px) !important;
+	}
+
+	/* Metrics unten etwas niedriger */
+	body.jf-page-frame .metric,
+	body.jf-page-frame .preMetric{
+		height:clamp(46px, 10vh, 60px) !important;
+		min-height:clamp(46px, 10vh, 60px) !important;
+	}
+}
+
+
+/* ======================================================
+   FRAME PATCH: Landscape Bild/Route/Speaker/Card
+====================================================== */
+
+/* Speaker exakt Live-Pill-Höhe */
+body.jf-page-frame #speechBtn,
+body.jf-page-frame #speechBtn.toggleBtn,
+body.jf-page-frame #speechBtn.speechBtn{
+	height:var(--jf-live-pill-h, 44px) !important;
+	min-height:var(--jf-live-pill-h, 44px) !important;
+	width:var(--jf-live-pill-h, 44px) !important;
+	min-width:var(--jf-live-pill-h, 44px) !important;
+	padding:0 !important;
+	border-radius:999px !important;
+	aspect-ratio:1 / 1 !important;
+	display:grid !important;
+	place-items:center !important;
+	font-size:calc(var(--jf-live-pill-h, 44px) * .43) !important;
+	line-height:1 !important;
+}
+
+body.jf-page-frame .livePill{
+	--jf-live-pill-h: clamp(34px, 4.0vmin, 44px);
+	height:var(--jf-live-pill-h) !important;
+}
+
+/* Querformat */
+@media (orientation:landscape){
+
+	/* Bildbereich stärker strecken */
+	body.jf-page-frame .jfFrameMain,
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-columns:minmax(0, 48%) minmax(0, 1fr) !important;
+		grid-template-rows:minmax(0, 1fr) clamp(48px, 8.5vh, 64px) !important;
+	}
+
+	body.jf-page-frame .photoWrap,
+	body.jf-page-frame .prePhoto{
+		height:100% !important;
+		min-height:clamp(280px, 62vh, 620px) !important;
+	}
+
+	body.jf-page-frame #planePhoto{
+		width:100% !important;
+		height:100% !important;
+		object-fit:cover !important;
+	}
+
+	/* Route-Zeile sauber, kein abgeschnittenes g mehr */
+	body.jf-page-frame .routeCities{
+		line-height:1.16 !important;
+		padding-bottom:.14em !important;
+		margin-bottom:-.04em !important;
+		overflow:visible !important;
+	}
+
+	body.jf-page-frame .routeCodes{
+		margin-top:-.10em !important;
+	}
+
+	/* Aircraft-Card kompakter und weniger breit */
+	body.jf-page-frame #aircraftCard.aircraftCard{
+		width:max-content !important;
+		min-width:min(360px, 76%) !important;
+		max-width:min(520px, 82%) !important;
+		padding-left:clamp(10px, 1.35vmin, 16px) !important;
+		padding-right:clamp(10px, 1.35vmin, 16px) !important;
+	}
+
+	body.jf-page-frame #aircraftCard #airline,
+	body.jf-page-frame #aircraftCard #aircraftTypeText{
+		max-width:clamp(180px, 24vw, 320px) !important;
+		overflow:hidden !important;
+		text-overflow:ellipsis !important;
+	}
+
+	body.jf-page-frame #aircraftCard #aircraftSize{
+		margin-left:clamp(12px, 1.8vmin, 22px) !important;
+	}
+}
+
+/* iPhone Querformat extra */
+@media (orientation:landscape) and (max-height:520px){
+
+	body.jf-page-frame .photoWrap,
+	body.jf-page-frame .prePhoto{
+		min-height:clamp(220px, 64vh, 380px) !important;
+	}
+
+	body.jf-page-frame .routeCities{
+		line-height:1.18 !important;
+		padding-bottom:.16em !important;
+	}
+
+	body.jf-page-frame #aircraftCard.aircraftCard{
+		min-width:min(330px, 74%) !important;
+		max-width:min(470px, 84%) !important;
+	}
+}
+
+
+/* ======================================================
+   FRAME PATCH: Speaker kleiner + Radar-Flieger dynamischer
+====================================================== */
+
+/* Speaker bewusst kleiner als Live-Pille */
+body.jf-page-frame #speechBtn,
+body.jf-page-frame #speechBtn.toggleBtn,
+body.jf-page-frame #speechBtn.speechBtn{
+	width:clamp(30px, 3.4vmin, 38px) !important;
+	min-width:clamp(30px, 3.4vmin, 38px) !important;
+	height:clamp(30px, 3.4vmin, 38px) !important;
+	min-height:clamp(30px, 3.4vmin, 38px) !important;
+	font-size:clamp(13px, 1.55vmin, 17px) !important;
+	padding:0 !important;
+	border-radius:999px !important;
+	display:grid !important;
+	place-items:center !important;
+}
+
+/* Live-Pille bleibt größer */
+body.jf-page-frame .livePill{
+	min-height:clamp(34px, 4vmin, 44px) !important;
+}
+
+/* mittleres Radar-Flugzeug lebendiger */
+body.jf-page-frame.jf-loaded.jf-no-flight .idlePlane{
+	animation:jfIdlePlaneFloat 3.2s ease-in-out infinite !important;
+	transform-origin:50% 55%;
+}
+
+@keyframes jfIdlePlaneFloat{
+	0%{
+		transform:translateY(0) rotate(-7deg) scale(1);
+	}
+	35%{
+		transform:translateY(-7px) rotate(-2deg) scale(1.04);
+	}
+	70%{
+		transform:translateY(4px) rotate(-10deg) scale(.99);
+	}
+	100%{
+		transform:translateY(0) rotate(-7deg) scale(1);
+	}
+}
+
+/* Radar-Sweep etwas lebendiger */
+body.jf-page-frame.jf-loaded.jf-no-flight .radarSweep{
+	animation:jfRadarSpin2 2.35s linear infinite !important;
+	opacity:.48 !important;
+}
+
+
+/* ======================================================
+   FRAME PATCH: Portrait unten sicher + Special kürzen
+====================================================== */
+
+/* Special-Pille nie aus dem Frame laufen lassen */
+body.jf-page-frame .special{
+	max-width:100% !important;
+	overflow:hidden !important;
+	text-overflow:ellipsis !important;
+	white-space:nowrap !important;
+	box-sizing:border-box !important;
+}
+
+/* Portrait: alles minimal kompakter, damit Metrics unten nicht abgeschnitten werden */
+@media (orientation:portrait){
+
+	body.jf-page-frame #wall.jf-shell{
+		padding-bottom:clamp(18px, 2.8vmin, 30px) !important;
+	}
+
+	body.jf-page-frame .jfFrameMain,
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-rows:minmax(190px, 34%) minmax(0, 1fr) clamp(54px, 7.6vh, 76px) !important;
+		gap:clamp(6px, .9vmin, 10px) !important;
+	}
+
+	body.jf-page-frame .photoWrap,
+	body.jf-page-frame .prePhoto{
+		max-height:clamp(250px, 34vh, 360px) !important;
+	}
+
+	body.jf-page-frame .info,
+	body.jf-page-frame .preInfo{
+		gap:clamp(2px, .45vmin, 6px) !important;
+	}
+
+	body.jf-page-frame .mode{
+		font-size:clamp(20px, 2.8vmin, 34px) !important;
+	}
+
+	body.jf-page-frame .iataCallsign{
+		font-size:clamp(34px, 5.5vmin, 64px) !important;
+		line-height:.88 !important;
+	}
+
+	body.jf-page-frame .routeCities{
+		font-size:clamp(27px, 4.4vmin, 52px) !important;
+		line-height:1.02 !important;
+		padding-bottom:.08em !important;
+	}
+
+	body.jf-page-frame .operatorCallsign,
+	body.jf-page-frame .routeCodes,
+	body.jf-page-frame .reg{
+		font-size:clamp(15px, 2.15vmin, 25px) !important;
+	}
+
+	body.jf-page-frame #aircraftCard.aircraftCard{
+		width:min(540px, 70%) !important;
+		padding:clamp(7px, .95vmin, 11px) clamp(11px, 1.3vmin, 16px) !important;
+	}
+
+	body.jf-page-frame #airline,
+	body.jf-page-frame #aircraftTypeText,
+	body.jf-page-frame #aircraftSize{
+		font-size:clamp(15px, 2.05vmin, 25px) !important;
+	}
+
+	body.jf-page-frame .special{
+		max-width:min(680px, 92%) !important;
+		font-size:clamp(13px, 1.75vmin, 21px) !important;
+		padding:clamp(6px, .8vmin, 9px) clamp(12px, 1.4vmin, 18px) !important;
+		margin-top:clamp(3px, .45vmin, 6px) !important;
+	}
+
+	body.jf-page-frame .metrics,
+	body.jf-page-frame .preMetrics{
+		height:clamp(54px, 7.6vh, 76px) !important;
+		min-height:clamp(54px, 7.6vh, 76px) !important;
+	}
+
+	body.jf-page-frame .metric,
+	body.jf-page-frame .preMetric{
+		height:clamp(54px, 7.6vh, 76px) !important;
+		min-height:clamp(54px, 7.6vh, 76px) !important;
+	}
+
+	body.jf-page-frame .metricValue{
+		font-size:clamp(23px, 3.7vmin, 42px) !important;
+	}
+
+	body.jf-page-frame .metricLabel{
+		font-size:clamp(7px, .95vmin, 11px) !important;
+	}
+}
+
+
+/* ======================================================
+   FRAME PATCH: Landscape Grid + Preload Sync
+====================================================== */
+
+@media (orientation:landscape){
+
+	body.jf-page-frame .jfFrameMain,
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-rows:minmax(0, 1fr) clamp(54px, 9vh, 72px) !important;
+		align-items:stretch !important;
+	}
+
+	body.jf-page-frame .photoWrap,
+	body.jf-page-frame .prePhoto{
+		height:100% !important;
+		min-height:0 !important;
+		max-height:100% !important;
+		align-self:stretch !important;
+		overflow:hidden !important;
+	}
+
+	body.jf-page-frame #planePhoto{
+		width:100% !important;
+		height:100% !important;
+		object-fit:cover !important;
+		display:block !important;
+	}
+
+	body.jf-page-frame .metrics,
+	body.jf-page-frame .preMetrics{
+		height:clamp(54px, 9vh, 72px) !important;
+		min-height:clamp(54px, 9vh, 72px) !important;
+		align-self:end !important;
+		z-index:5 !important;
+	}
+
+	body.jf-page-frame .metric,
+	body.jf-page-frame .preMetric{
+		height:100% !important;
+		min-height:0 !important;
+	}
+
+	/* Preload-Info exakt an die echten kompakteren Textzeilen angleichen */
+	body.jf-page-frame .preInfo{
+		gap:clamp(4px, .8vmin, 9px) !important;
+		padding-left:clamp(4px, .8vmin, 12px) !important;
+		padding-top:clamp(4px, .8vmin, 10px) !important;
+		overflow:hidden !important;
+	}
+
+	body.jf-page-frame .skMode{
+		height:clamp(18px, 3.2vmin, 30px) !important;
+		width:min(330px, 46%) !important;
+	}
+
+	body.jf-page-frame .prePillRow{
+		gap:clamp(8px, 1.2vmin, 14px) !important;
+	}
+
+	body.jf-page-frame .skPillA,
+	body.jf-page-frame .skPillB{
+		height:clamp(27px, 4.2vmin, 38px) !important;
+	}
+
+	body.jf-page-frame .skPillA{
+		width:clamp(180px, 23vw, 300px) !important;
+	}
+
+	body.jf-page-frame .skPillB{
+		width:clamp(110px, 12vw, 170px) !important;
+	}
+
+	body.jf-page-frame .skCall{
+		height:clamp(32px, 5.8vmin, 50px) !important;
+		width:min(300px, 40%) !important;
+	}
+
+	body.jf-page-frame .skSmall,
+	body.jf-page-frame .skCodes,
+	body.jf-page-frame .skReg{
+		height:clamp(14px, 2.2vmin, 22px) !important;
+	}
+
+	body.jf-page-frame .skRoute{
+		height:clamp(28px, 5vmin, 44px) !important;
+		width:min(620px, 82%) !important;
+	}
+
+	body.jf-page-frame .preCard{
+		width:max-content !important;
+		min-width:min(360px, 76%) !important;
+		max-width:min(520px, 82%) !important;
+		padding:clamp(7px, 1vmin, 11px) clamp(10px, 1.35vmin, 16px) !important;
+		border-radius:clamp(16px, 2.3vmin, 24px) !important;
+		gap:clamp(5px, .8vmin, 9px) !important;
+	}
+
+	body.jf-page-frame .preCardRow{
+		grid-template-columns:clamp(22px, 3.6vmin, 34px) minmax(0, 1fr) auto !important;
+		gap:clamp(8px, 1.1vmin, 12px) !important;
+	}
+
+	body.jf-page-frame .preLogo{
+		width:clamp(22px, 3.6vmin, 34px) !important;
+		height:clamp(22px, 3.6vmin, 34px) !important;
+	}
+
+	body.jf-page-frame .skAirline,
+	body.jf-page-frame .skType{
+		height:clamp(14px, 2.3vmin, 22px) !important;
+	}
+
+	body.jf-page-frame .skAirline{
+		width:clamp(150px, 22vw, 280px) !important;
+	}
+
+	body.jf-page-frame .skType{
+		width:clamp(140px, 20vw, 260px) !important;
+	}
+
+	body.jf-page-frame .skSize{
+		width:clamp(80px, 10vw, 130px) !important;
+		height:clamp(14px, 2.3vmin, 22px) !important;
+	}
+
+	body.jf-page-frame .preMetric .sk{
+		width:45% !important;
+		height:clamp(10px, 1.8vmin, 18px) !important;
+	}
+}
+
+@media (orientation:landscape) and (max-height:520px){
+
+	body.jf-page-frame .jfFrameMain,
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-rows:minmax(0, 1fr) clamp(46px, 10vh, 60px) !important;
+	}
+
+	body.jf-page-frame .metrics,
+	body.jf-page-frame .preMetrics{
+		height:clamp(46px, 10vh, 60px) !important;
+		min-height:clamp(46px, 10vh, 60px) !important;
+	}
+
+	body.jf-page-frame .preInfo{
+		gap:clamp(3px, .65vmin, 7px) !important;
+	}
+
+	body.jf-page-frame .skMode{
+		height:clamp(16px, 3.1vmin, 24px) !important;
+	}
+
+	body.jf-page-frame .skPillA,
+	body.jf-page-frame .skPillB{
+		height:clamp(23px, 4.4vmin, 32px) !important;
+	}
+
+	body.jf-page-frame .skCall{
+		height:clamp(28px, 5.5vmin, 42px) !important;
+	}
+
+	body.jf-page-frame .skRoute{
+		height:clamp(24px, 4.8vmin, 36px) !important;
+	}
+
+	body.jf-page-frame .preCard{
+		min-width:min(330px, 74%) !important;
+		max-width:min(470px, 84%) !important;
+		padding:clamp(5px, .9vmin, 8px) clamp(8px, 1.3vmin, 12px) !important;
+	}
+}
+
+
+
+/* ======================================================
+   FRAME MINI FIX: Logo Badges final
+====================================================== */
+
+body.jf-page-frame #airlineLogoImg,
+body.jf-page-frame #manufacturerLogoImg{
+	width:30px !important;
+	height:30px !important;
+	min-width:30px !important;
+	min-height:30px !important;
+	border-radius:999px !important;
+	background:#fff !important;
+	padding:0 !important;
+	object-fit:contain !important;
+	box-sizing:border-box !important;
+	box-shadow:
+		inset 0 0 0 1px rgba(0,0,0,.10),
+		0 2px 8px rgba(0,0,0,.16) !important;
+}
+
+/* Fallback-Kreis standardmäßig AUS, sonst entsteht der dritte Kreis */
+body.jf-page-frame #manufacturerLogoText{
+	display:none !important;
+}
+
+body.jf-page-frame #manufacturerLogoText.isFallback{
+	width:30px !important;
+	height:30px !important;
+	min-width:30px !important;
+	min-height:30px !important;
+	border-radius:999px !important;
+	background:#fff !important;
+	padding:0 !important;
+	box-sizing:border-box !important;
+	box-shadow:
+		inset 0 0 0 1px rgba(0,0,0,.10),
+		0 2px 8px rgba(0,0,0,.16) !important;
+	color:#132238 !important;
+	font-weight:900 !important;
+	font-size:13px !important;
+	line-height:1 !important;
+	display:grid !important;
+	place-items:center !important;
+}
+
+
+/* ======================================================
+   FRAME: Flight Switch Animation V2
+   Mehrere kleine Flugzeuge mit Kurvenbahnen
+====================================================== */
+
+body.jf-page-frame .jfFlightSwitch{
+	position:absolute;
+	inset:0;
+	z-index:29;
+	pointer-events:none;
+	display:grid;
+	place-items:center;
+	opacity:0;
+	visibility:hidden;
+	border-radius:inherit;
+	overflow:hidden;
+	background:
+		radial-gradient(circle at 50% 44%, rgba(50,232,121,.16), transparent 34%),
+		linear-gradient(135deg, rgba(255,255,255,.07), rgba(5,6,10,.20));
+	backdrop-filter:blur(9px) saturate(135%);
+}
+
+body.jf-page-frame.jf-flight-switch .jfFlightSwitch{
+	visibility:visible;
+	animation:jfSwitchV2Fade 1.75s ease forwards;
+}
+
+body.jf-page-frame .jfSwitchRadar{
+	position:absolute;
+	width:min(48vmin, 380px);
+	aspect-ratio:1;
+	border-radius:999px;
+	border:1px solid rgba(255,255,255,.18);
+	box-shadow:
+		0 0 0 11vmin rgba(255,255,255,.018),
+		0 0 0 22vmin rgba(255,255,255,.012);
+	opacity:.82;
+}
+
+body.jf-page-frame .jfSwitchRadar::before,
+body.jf-page-frame .jfSwitchRadar::after{
+	content:"";
+	position:absolute;
+	inset:0;
+	border-radius:999px;
+}
+
+body.jf-page-frame .jfSwitchRadar::before{
+	border:1px solid rgba(255,255,255,.10);
+	transform:scale(.58);
+}
+
+body.jf-page-frame .jfSwitchRadar::after{
+	background:conic-gradient(from 0deg, rgba(50,232,121,.36), transparent 18%, transparent);
+	animation:jfSwitchV2Radar 1.15s linear infinite;
+}
+
+body.jf-page-frame .jfSwitchPlane{
+	position:absolute;
+	left:-14%;
+	top:50%;
+	opacity:0;
+	filter:drop-shadow(0 10px 22px rgba(0,0,0,.42));
+	will-change:transform, opacity;
+}
+
+body.jf-page-frame .jfSwitchPlaneA{
+	font-size:clamp(28px, 5.2vmin, 56px);
+}
+
+body.jf-page-frame .jfSwitchPlaneB{
+	font-size:clamp(22px, 4.1vmin, 44px);
+}
+
+body.jf-page-frame .jfSwitchPlaneC{
+	font-size:clamp(20px, 3.7vmin, 40px);
+}
+
+body.jf-page-frame .jfSwitchPlaneD{
+	font-size:clamp(18px, 3.3vmin, 36px);
+}
+
+body.jf-page-frame.jf-flight-switch .jfSwitchPlaneA{
+	animation:jfSwitchV2FlyA 1.45s cubic-bezier(.22,.8,.22,1) forwards;
+}
+
+body.jf-page-frame.jf-flight-switch .jfSwitchPlaneB{
+	animation:jfSwitchV2FlyB 1.55s cubic-bezier(.22,.8,.22,1) .08s forwards;
+}
+
+body.jf-page-frame.jf-flight-switch .jfSwitchPlaneC{
+	animation:jfSwitchV2FlyC 1.62s cubic-bezier(.22,.8,.22,1) .16s forwards;
+}
+
+body.jf-page-frame.jf-flight-switch .jfSwitchPlaneD{
+	animation:jfSwitchV2FlyD 1.35s cubic-bezier(.22,.8,.22,1) .28s forwards;
+}
+
+body.jf-page-frame .jfSwitchText{
+	position:absolute;
+	left:50%;
+	bottom:clamp(42px, 7.5vmin, 86px);
+	transform:translateX(-50%);
+	text-align:center;
+	opacity:0;
+}
+
+body.jf-page-frame.jf-flight-switch .jfSwitchText{
+	animation:jfSwitchV2Text 1.55s ease .08s forwards;
+}
+
+body.jf-page-frame .jfSwitchLabel{
+	font-size:clamp(15px, 2.2vmin, 26px);
+	font-weight:900;
+	color:rgba(255,255,255,.68);
+	letter-spacing:-.03em;
+}
+
+body.jf-page-frame .jfSwitchRoute{
+	margin-top:3px;
+	max-width:86vw;
+	overflow:hidden;
+	text-overflow:ellipsis;
+	white-space:nowrap;
+	font-size:clamp(24px, 4.1vmin, 50px);
+	font-weight:950;
+	color:#fff;
+	letter-spacing:-.06em;
+	text-shadow:0 12px 28px rgba(0,0,0,.45);
+}
+
+@keyframes jfSwitchV2Fade{
+	0%{ opacity:0; }
+	14%{ opacity:1; }
+	82%{ opacity:1; }
+	100%{ opacity:0; }
+}
+
+@keyframes jfSwitchV2Radar{
+	to{ transform:rotate(360deg); }
+}
+
+@keyframes jfSwitchV2Text{
+	0%{
+		opacity:0;
+		transform:translateX(-50%) translateY(18px) scale(.96);
+	}
+	22%{
+		opacity:1;
+		transform:translateX(-50%) translateY(0) scale(1);
+	}
+	78%{
+		opacity:1;
+		transform:translateX(-50%) translateY(0) scale(1);
+	}
+	100%{
+		opacity:0;
+		transform:translateX(-50%) translateY(-10px) scale(.98);
+	}
+}
+
+@keyframes jfSwitchV2FlyA{
+	0%{
+		transform:translate(0, 34px) rotate(13deg) scale(.72);
+		opacity:0;
+	}
+	12%{ opacity:.95; }
+	48%{
+		transform:translate(48vw, -38px) rotate(-8deg) scale(1.02);
+		opacity:1;
+	}
+	100%{
+		transform:translate(126vw, -4px) rotate(10deg) scale(.88);
+		opacity:0;
+	}
+}
+
+@keyframes jfSwitchV2FlyB{
+	0%{
+		transform:translate(0, -44px) rotate(-12deg) scale(.62);
+		opacity:0;
+	}
+	14%{ opacity:.78; }
+	52%{
+		transform:translate(42vw, 26px) rotate(9deg) scale(.9);
+		opacity:.9;
+	}
+	100%{
+		transform:translate(118vw, -34px) rotate(-7deg) scale(.72);
+		opacity:0;
+	}
+}
+
+@keyframes jfSwitchV2FlyC{
+	0%{
+		transform:translate(0, 5px) rotate(4deg) scale(.50);
+		opacity:0;
+	}
+	20%{ opacity:.65; }
+	55%{
+		transform:translate(54vw, 58px) rotate(15deg) scale(.72);
+		opacity:.78;
+	}
+	100%{
+		transform:translate(124vw, 34px) rotate(2deg) scale(.58);
+		opacity:0;
+	}
+}
+
+@keyframes jfSwitchV2FlyD{
+	0%{
+		transform:translate(0, -12px) rotate(18deg) scale(.42);
+		opacity:0;
+	}
+	22%{ opacity:.55; }
+	62%{
+		transform:translate(38vw, -70px) rotate(-18deg) scale(.62);
+		opacity:.7;
+	}
+	100%{
+		transform:translate(105vw, -44px) rotate(8deg) scale(.48);
+		opacity:0;
+	}
+}
+
+
+/* ======================================================
+   FRAME MINI FIX: Switch-Reihenfolge + Portrait Luft + Header Buttons
+====================================================== */
+
+/* Header: Speaker exakt gleiche Höhe wie Live-Pille */
+body.jf-page-frame .frameHeaderActions{
+	--jfHeaderPillH: clamp(38px, 4.8vmin, 50px);
+	align-items:center !important;
+}
+
+body.jf-page-frame .frameHeaderActions .livePill{
+	height:var(--jfHeaderPillH) !important;
+	min-height:var(--jfHeaderPillH) !important;
+}
+
+body.jf-page-frame #speechBtn,
+body.jf-page-frame #speechBtn.toggleBtn,
+body.jf-page-frame #speechBtn.speechBtn,
+body.jf-page-frame #speechBtn.toggleBtn.on,
+body.jf-page-frame #speechBtn.speechBtn.on{
+	width:var(--jfHeaderPillH) !important;
+	min-width:var(--jfHeaderPillH) !important;
+	height:var(--jfHeaderPillH) !important;
+	min-height:var(--jfHeaderPillH) !important;
+	padding:0 !important;
+	border-radius:999px !important;
+	display:grid !important;
+	place-items:center !important;
+	font-size:calc(var(--jfHeaderPillH) * .42) !important;
+	line-height:1 !important;
+}
+
+/* Hochkant: etwas luftiger, Preload synchron */
+@media (orientation:portrait){
+	body.jf-page-frame .jfFrameMain,
+	body.jf-page-frame .jfPreloadOverlay{
+		grid-template-rows:minmax(185px, 31.5%) minmax(0, 1fr) clamp(54px, 7.3vh, 74px) !important;
+		gap:clamp(11px, 1.45vmin, 17px) !important;
+	}
+
+	body.jf-page-frame .info,
+	body.jf-page-frame .preInfo{
+		gap:clamp(7px, 1.05vmin, 13px) !important;
+	}
+
+	body.jf-page-frame .flightInfoPillRow,
+	body.jf-page-frame .prePillRow{
+		margin-top:clamp(1px, .35vmin, 4px) !important;
+		margin-bottom:clamp(1px, .35vmin, 4px) !important;
+	}
+
+	body.jf-page-frame .routeCities{
+		line-height:1.18 !important;
+		padding-bottom:.14em !important;
+	}
+
+	body.jf-page-frame .routeCodes{
+		margin-top:-.05em !important;
+	}
+
+	body.jf-page-frame #aircraftCard.aircraftCard,
+	body.jf-page-frame .preCard{
+		margin-top:clamp(8px, 1.1vmin, 14px) !important;
+	}
+
+	body.jf-page-frame .reg{
+		margin-top:clamp(2px, .45vmin, 6px) !important;
+	}
+
+	body.jf-page-frame .special{
+		margin-top:clamp(5px, .7vmin, 9px) !important;
+	}
+
+	body.jf-page-frame .metrics,
+	body.jf-page-frame .preMetrics{
+		height:clamp(54px, 7.3vh, 74px) !important;
+		min-height:clamp(54px, 7.3vh, 74px) !important;
+	}
+}
+
+/* Flight-Switch etwas deutlicher, damit er vor Flug 2 wahrgenommen wird */
+body.jf-page-frame.jf-flight-switch .jfFlightSwitch{
+	z-index:80 !important;
+}
+
+/* ======================================================
+   FRAME MINI FIX: Flight-Switch Overlay umfasst Metrics
+====================================================== */
+
+/* Overlay deutlich größer als sichtbarer Frame, damit keine harte Kante entsteht */
+body.jf-page-frame .jfFlightSwitch{
+	inset:-36px !important;
+	border-radius:calc(clamp(26px, 4vmin, 44px) + 36px) !important;
+	background:
+		radial-gradient(circle at 50% 48%, rgba(50,232,121,.18), transparent 40%),
+		linear-gradient(180deg, rgba(8,10,18,.22), rgba(8,10,18,.64)) !important;
+	backdrop-filter:blur(12px) saturate(135%) !important;
+	-webkit-backdrop-filter:blur(12px) saturate(135%) !important;
+
+	mask-image:radial-gradient(
+		ellipse at center,
+		#000 72%,
+		rgba(0,0,0,.88) 84%,
+		rgba(0,0,0,.35) 94%,
+		transparent 100%
+	);
+	-webkit-mask-image:radial-gradient(
+		ellipse at center,
+		#000 72%,
+		rgba(0,0,0,.88) 84%,
+		rgba(0,0,0,.35) 94%,
+		transparent 100%
+	);
+}
+
+/* Metrics NICHT ausblenden, sondern bewusst mit in den Glas-Effekt nehmen */
+body.jf-page-frame.jf-flight-switch .metrics{
+	opacity:.42 !important;
+	filter:blur(3px) saturate(.85) !important;
+	transition:opacity .28s ease, filter .28s ease !important;
+}
+
+/* Foto + Text ebenfalls weich darunter sichtbar */
+body.jf-page-frame.jf-flight-switch .photoWrap,
+body.jf-page-frame.jf-flight-switch .info{
+	opacity:.36 !important;
+	filter:blur(4px) saturate(.82) !important;
+	transition:opacity .28s ease, filter .28s ease !important;
+}
+
+/* weicher Fade statt harter Kasten */
+body.jf-page-frame.jf-flight-switch .jfFlightSwitch{
+	animation:jfSwitchSoftFade2 1.75s ease forwards !important;
+}
+
+@keyframes jfSwitchSoftFade2{
+	0%{ opacity:0; }
+	18%{ opacity:1; }
+	76%{ opacity:1; }
+	100%{ opacity:0; }
+}
+
+
+/* ======================================================
+   FRAME MINI FIX: Overlay oben tiefer wegen Statusbar
+====================================================== */
+
+/* Overlay etwas weiter nach unten */
+body.jf-page-frame .jfFlightSwitch{
+	top:42px !important;
+	left:-36px !important;
+	right:-36px !important;
+	bottom:-36px !important;
+}
+
+/* Radar ebenfalls minimal tiefer */
+body.jf-page-frame .jfFlightSwitchRadar{
+	transform:translateY(22px) scale(1.02) !important;
+}
+
+/* Text unten stabil */
+body.jf-page-frame .jfFlightSwitchNext{
+	bottom:72px !important;
+}
+
+/* weicher Verlauf oben */
+body.jf-page-frame .jfFlightSwitch::before{
+	content:"";
+	position:absolute;
+	inset:-60px;
+	background:
+		linear-gradient(
+			180deg,
+			transparent 0%,
+			rgba(8,10,18,.10) 12%,
+			rgba(8,10,18,.28) 22%,
+			rgba(8,10,18,.52) 100%
+		);
+	pointer-events:none;
+}
+
+
+
+/* ======================================================
+   INDEX: Global Power Button
+====================================================== */
+
+html,
+body{
+	touch-action:pan-x pan-y;
+	overscroll-behavior:none;
+	-webkit-text-size-adjust:100%;
+}
+
+body.jf-page-home #globalPowerBtn.power{
+	cursor:pointer;
+	border-color:rgba(50,232,121,.28);
+	background:
+		linear-gradient(135deg, rgba(50,232,121,.18), rgba(255,255,255,.07));
+}
+
+body.jf-page-home #globalPowerBtn.power.off{
+	border-color:rgba(255,77,94,.32);
+	background:
+		linear-gradient(135deg, rgba(255,77,94,.18), rgba(255,255,255,.06));
+}
+
+body.jf-page-home .powerState{
+	min-width:58px;
+	height:38px;
+	border-radius:999px;
+	display:grid;
+	place-items:center;
+	font-weight:950;
+	letter-spacing:.03em;
+	background:rgba(50,232,121,.18);
+	border:1px solid rgba(50,232,121,.36);
+	color:#dffff0;
+}
+
+body.jf-page-home #globalPowerBtn.off .powerState{
+	background:rgba(255,77,94,.18);
+	border-color:rgba(255,77,94,.38);
+	color:#ffd2d7;
+}
+
+/* ======================================================
+   FRAME MINI FIX: Airline/Manufacturer Row Alignment
+====================================================== */
+
+body.jf-page-frame #aircraftCard.aircraftCard{
+	--jfLogoSize: 34px;
+	--jfLogoGap: 14px;
+}
+
+/* beide Zeilen identisch aufbauen */
+body.jf-page-frame #airlineMini,
+body.jf-page-frame #manufacturerLogo{
+	display:grid !important;
+	grid-template-columns:var(--jfLogoSize) minmax(0, 1fr) !important;
+	align-items:center !important;
+	column-gap:var(--jfLogoGap) !important;
+}
+
+/* Logo-Kreise exakt gleich groß */
+body.jf-page-frame #airlineLogoImg,
+body.jf-page-frame #manufacturerLogoImg,
+body.jf-page-frame #manufacturerLogoText{
+	width:var(--jfLogoSize) !important;
+	height:var(--jfLogoSize) !important;
+	min-width:var(--jfLogoSize) !important;
+	min-height:var(--jfLogoSize) !important;
+	max-width:var(--jfLogoSize) !important;
+	max-height:var(--jfLogoSize) !important;
+	border-radius:999px !important;
+	object-fit:contain !important;
+	box-sizing:border-box !important;
+}
+
+/* Textstart bei Airline und Hersteller exakt gleich */
+body.jf-page-frame #airline{
+	grid-column:2 !important;
+	align-self:center !important;
+}
+
+body.jf-page-frame #aircraftTypeText{
+	grid-column:1 !important;
+	margin-left:calc(var(--jfLogoSize) + var(--jfLogoGap)) !important;
+	align-self:center !important;
+}
+
+/* Größen harmonisieren */
+body.jf-page-frame #airline,
+body.jf-page-frame #aircraftTypeText,
+body.jf-page-frame #aircraftSize{
+	font-size:clamp(16px, 2.15vmin, 26px) !important;
+	line-height:1.05 !important;
+}
+
+/* Size rechts sauber mittig */
+body.jf-page-frame #aircraftSize{
+	align-self:center !important;
+	justify-self:end !important;
+}
+
+/* Querformat minimal kompakter, aber gleiches Raster */
+@media (orientation:landscape){
+	body.jf-page-frame #aircraftCard.aircraftCard{
+		--jfLogoSize: 30px;
+		--jfLogoGap: 12px;
+	}
+
+	body.jf-page-frame #airline,
+	body.jf-page-frame #aircraftTypeText,
+	body.jf-page-frame #aircraftSize{
+		font-size:clamp(14px, 2.55vmin, 22px) !important;
+	}
+}
+
+
+
+/* ======================================================
+   LANDSCAPE: alles etwas kleiner, damit Special reinpasst
+====================================================== */
+
+@media (orientation:landscape){
+	body.jf-page-frame #aircraftCard.aircraftCard{
+		--jfLogoSize: clamp(24px, 3.1vmin, 30px);
+		--jfLogoGap: clamp(8px, 1.1vmin, 12px);
+
+		width:min(58%, 520px) !important;
+		max-width:520px !important;
+		row-gap:clamp(4px, .65vmin, 7px) !important;
+		padding-top:clamp(7px, 1vmin, 10px) !important;
+		padding-bottom:clamp(7px, 1vmin, 10px) !important;
+	}
+
+	body.jf-page-frame #airline,
+	body.jf-page-frame #aircraftTypeText,
+	body.jf-page-frame #aircraftSize{
+		font-size:clamp(13px, 2.05vmin, 19px) !important;
+		line-height:1.02 !important;
+	}
+
+	body.jf-page-frame .reg{
+		font-size:clamp(12px, 1.75vmin, 17px) !important;
+		margin-top:clamp(3px, .55vmin, 6px) !important;
+	}
+
+	body.jf-page-frame .special{
+		max-width:min(44%, 390px) !important;
+		font-size:clamp(11px, 1.75vmin, 16px) !important;
+		line-height:1.05 !important;
+		padding:clamp(5px, .75vmin, 8px) clamp(10px, 1.2vmin, 14px) !important;
+		margin-top:clamp(4px, .6vmin, 7px) !important;
+	}
+
+	body.jf-page-frame .info{
+		gap:clamp(3px, .55vmin, 7px) !important;
+	}
+
+	body.jf-page-frame .routeCities{
+		line-height:1.13 !important;
+		padding-bottom:.08em !important;
+	}
+
+	body.jf-page-frame .routeCodes{
+		margin-top:-.08em !important;
+	}
+}
+
+/* ======================================================
+   PRELOAD: Card-Blöcke an neue echte Card-Größe angleichen
+====================================================== */
+
+body.jf-page-frame.jf-preload .preCard,
+body.jf-page-frame.jf-preload .sk-card{
+	width:min(70%, 560px) !important;
+	max-width:560px !important;
+}
+
+@media (orientation:landscape){
+	body.jf-page-frame.jf-preload .preCard,
+	body.jf-page-frame.jf-preload .sk-card{
+		width:min(58%, 520px) !important;
+		max-width:520px !important;
+	}
+
+	body.jf-page-frame.jf-preload .preInfo,
+	body.jf-page-frame.jf-preload .jfInfoSkeleton{
+		gap:clamp(3px, .55vmin, 7px) !important;
+	}
+}
+
+
+
+
+/* ======================================================
+   FRAME CLEAN: Aircraft Card einheitlich
+====================================================== */
+
+body.jf-page-frame:not(.jf-preload) #aircraftCard.aircraftCard{
+	--jfCardLogo: clamp(30px, 3.9vmin, 40px);
+	--jfCardGap: clamp(10px, 1.2vmin, 14px);
+
+	display:grid !important;
+	grid-template-columns:var(--jfCardLogo) minmax(0, 1fr) auto !important;
+	grid-template-rows:auto auto auto !important;
+	column-gap:var(--jfCardGap) !important;
+	row-gap:clamp(6px, .85vmin, 10px) !important;
+	align-items:center !important;
+	width:min(70%, 560px) !important;
+	max-width:560px !important;
+	overflow:hidden !important;
+}
+
+/* Airline-Zeile */
+body.jf-page-frame:not(.jf-preload) #airlineMini{
+	grid-column:1 / 4 !important;
+	grid-row:1 !important;
+	display:grid !important;
+	grid-template-columns:var(--jfCardLogo) minmax(0, 1fr) !important;
+	column-gap:var(--jfCardGap) !important;
+	align-items:center !important;
+	min-width:0 !important;
+}
+
+/* Divider */
+body.jf-page-frame:not(.jf-preload) #aircraftCard .aircraftSep{
+	grid-column:1 / 4 !important;
+	grid-row:2 !important;
+	width:100% !important;
+	height:1px !important;
+	margin:0 !important;
+}
+
+/* Hersteller-Zeile */
+body.jf-page-frame:not(.jf-preload) #manufacturerLogo{
+	grid-column:1 !important;
+	grid-row:3 !important;
+	width:var(--jfCardLogo) !important;
+	height:var(--jfCardLogo) !important;
+	min-width:var(--jfCardLogo) !important;
+	min-height:var(--jfCardLogo) !important;
+	display:grid !important;
+	place-items:center !important;
+	margin:0 !important;
+	padding:0 !important;
+	overflow:hidden !important;
+}
+
+body.jf-page-frame:not(.jf-preload) #aircraftTypeText{
+	grid-column:2 !important;
+	grid-row:3 !important;
+	margin:0 !important;
+	padding:0 !important;
+	min-width:0 !important;
+	overflow:hidden !important;
+	text-overflow:ellipsis !important;
+	white-space:nowrap !important;
+	align-self:center !important;
+}
+
+body.jf-page-frame:not(.jf-preload) #aircraftSize{
+	grid-column:3 !important;
+	grid-row:3 !important;
+	margin:0 !important;
+	padding:0 !important;
+	justify-self:end !important;
+	align-self:center !important;
+	white-space:nowrap !important;
+}
+
+/* Logo-Badges exakt gleich */
+body.jf-page-frame:not(.jf-preload) #airlineLogoImg,
+body.jf-page-frame:not(.jf-preload) #manufacturerLogoImg,
+body.jf-page-frame:not(.jf-preload) #manufacturerLogoText{
+	width:var(--jfCardLogo) !important;
+	height:var(--jfCardLogo) !important;
+	min-width:var(--jfCardLogo) !important;
+	min-height:var(--jfCardLogo) !important;
+	max-width:var(--jfCardLogo) !important;
+	max-height:var(--jfCardLogo) !important;
+	border-radius:999px !important;
+	object-fit:contain !important;
+	margin:0 !important;
+	padding:0 !important;
+	box-sizing:border-box !important;
+}
+
+/* Fallback-Kreis nur anzeigen, wenn JS ihn wirklich braucht */
+body.jf-page-frame:not(.jf-preload) #manufacturerLogoText{
+	display:none !important;
+}
+
+body.jf-page-frame:not(.jf-preload) #manufacturerLogoText.isFallback{
+	display:grid !important;
+	place-items:center !important;
+}
+
+/* Textgrößen in der Card harmonisieren */
+body.jf-page-frame:not(.jf-preload) #airline,
+body.jf-page-frame:not(.jf-preload) #aircraftTypeText,
+body.jf-page-frame:not(.jf-preload) #aircraftSize{
+	font-size:clamp(16px, 2.15vmin, 25px) !important;
+	line-height:1.06 !important;
+}
+
+/* Special kompakt und nie über Metrics */
+body.jf-page-frame:not(.jf-preload) #special.special{
+	max-width:min(70%, 520px) !important;
+	overflow:hidden !important;
+	text-overflow:ellipsis !important;
+	white-space:nowrap !important;
+}
+
+/* Querformat kompakter */
+@media (orientation:landscape){
+	body.jf-page-frame:not(.jf-preload) #aircraftCard.aircraftCard{
+		--jfCardLogo: clamp(24px, 3vmin, 30px);
+		--jfCardGap: clamp(8px, 1vmin, 11px);
+
+		width:min(50%, 500px) !important;
+		max-width:500px !important;
+		row-gap:clamp(4px, .55vmin, 6px) !important;
+		padding-top:clamp(7px, .85vmin, 10px) !important;
+		padding-bottom:clamp(7px, .85vmin, 10px) !important;
+	}
+
+	body.jf-page-frame:not(.jf-preload) #airline,
+	body.jf-page-frame:not(.jf-preload) #aircraftTypeText,
+	body.jf-page-frame:not(.jf-preload) #aircraftSize{
+		font-size:clamp(13px, 1.75vmin, 18px) !important;
+		line-height:1.02 !important;
+	}
+
+	body.jf-page-frame:not(.jf-preload) #special.special{
+		max-width:min(34%, 330px) !important;
+		font-size:clamp(10px, 1.45vmin, 14px) !important;
+		line-height:1.02 !important;
+		padding:5px 11px !important;
+		margin-top:3px !important;
+	}
+}
+
+/* ======================================================
+   FRAME MINI FIX: Manufacturer/Airline Logos nicht abschneiden
+====================================================== */
+
+body.jf-page-frame:not(.jf-preload) #aircraftCard.aircraftCard{
+	--jfCardLogo: clamp(34px, 4.1vmin, 42px) !important;
+	row-gap:clamp(8px, 1vmin, 12px) !important;
+}
+
+/* Logo-Zellen etwas Luft geben, damit runde Badges nicht beschnitten werden */
+body.jf-page-frame:not(.jf-preload) #airlineMini,
+body.jf-page-frame:not(.jf-preload) #manufacturerLogo{
+	overflow:visible !important;
+}
+
+body.jf-page-frame:not(.jf-preload) #manufacturerLogo{
+	width:var(--jfCardLogo) !important;
+	height:var(--jfCardLogo) !important;
+	min-width:var(--jfCardLogo) !important;
+	min-height:var(--jfCardLogo) !important;
+}
+
+/* Bilder kleiner IN den Kreis setzen, Kreis bleibt gleich groß */
+body.jf-page-frame:not(.jf-preload) #airlineLogoImg,
+body.jf-page-frame:not(.jf-preload) #manufacturerLogoImg,
+body.jf-page-frame:not(.jf-preload) #manufacturerLogoText{
+	width:var(--jfCardLogo) !important;
+	height:var(--jfCardLogo) !important;
+	min-width:var(--jfCardLogo) !important;
+	min-height:var(--jfCardLogo) !important;
+	max-width:var(--jfCardLogo) !important;
+	max-height:var(--jfCardLogo) !important;
+	padding:3px !important;
+	object-fit:contain !important;
+	object-position:center !important;
+	overflow:hidden !important;
+}
+
+/* Text bleibt sauber hinter dem Logo */
+body.jf-page-frame:not(.jf-preload) #aircraftTypeText{
+	align-self:center !important;
+	line-height:1.12 !important;
+}
+
+body.jf-page-frame:not(.jf-preload) #airline{
+	line-height:1.12 !important;
+}
+
+/* Landscape wieder kompakter, aber nicht abschneiden */
+@media (orientation:landscape){
+	body.jf-page-frame:not(.jf-preload) #aircraftCard.aircraftCard{
+		--jfCardLogo: clamp(28px, 3.15vmin, 32px) !important;
+		row-gap:clamp(5px, .7vmin, 8px) !important;
+	}
+
+	body.jf-page-frame:not(.jf-preload) #airlineLogoImg,
+	body.jf-page-frame:not(.jf-preload) #manufacturerLogoImg,
+	body.jf-page-frame:not(.jf-preload) #manufacturerLogoText{
+		padding:2px !important;
+	}
+
+	body.jf-page-frame:not(.jf-preload) #aircraftTypeText,
+	body.jf-page-frame:not(.jf-preload) #airline{
+		line-height:1.08 !important;
+	}
+}
+
+
+
+
+
+/* gleiche Kreisgröße wie die weißen Kreise */
+:root{
+    --jfLogoCircle: 54px;
+}
+
+/* Reihen sauber */
+.airlineMini,
+.manufacturerMini{
+    display:flex !important;
+    align-items:center !important;
+    gap:16px !important;
+}
+
+/* Logos exakt gleich */
+#airlineLogoImg,
+#manufacturerLogoImg,
+#manufacturerLogoText{
+    width:var(--jfLogoCircle) !important;
+    height:var(--jfLogoCircle) !important;
+    min-width:var(--jfLogoCircle) !important;
+    min-height:var(--jfLogoCircle) !important;
+    max-width:var(--jfLogoCircle) !important;
+    max-height:var(--jfLogoCircle) !important;
+
+    border-radius:999px !important;
+    object-fit:contain !important;
+    object-position:center !important;
+
+    display:flex !important;
+    align-items:center !important;
+    justify-content:center !important;
+
+    overflow:hidden !important;
+    flex-shrink:0 !important;
+    box-sizing:border-box !important;
+}
+
+/* Airbus/Text NICHT verrutschen */
+#aircraftTypeText{
+    margin-left:0 !important;
+    padding-left:0 !important;
+    position:relative !important;
+    left:0 !important;
+    transform:none !important;
+    align-self:center !important;
+}
+
+/* Airline ebenfalls */
+#airline{
+    margin-left:0 !important;
+    padding-left:0 !important;
+    align-self:center !important;
+}
+
+/* Landscape kompakter */
+@media (orientation:landscape){
+
+    :root{
+        --jfLogoCircle: 44px;
+    }
+
+    .airlineMini,
+    .manufacturerMini{
+        gap:12px !important;
+    }
+
+    #aircraftTypeText,
+    #airline{
+        font-size:.92em !important;
+        line-height:1.05 !important;
+    }
+}
+
+
+
+
+
+@media (orientation:landscape){
+
+    /* Zweite Reihe sauber */
+    .manufacturerMini{
+        display:grid !important;
+        grid-template-columns: 44px minmax(0,1fr) auto !important;
+        align-items:center !important;
+        column-gap:14px !important;
+    }
+
+    /* Airbus Text NICHT mittig/rechts */
+    #aircraftTypeText{
+        justify-self:start !important;
+        text-align:left !important;
+
+        margin:0 !important;
+        padding:0 !important;
+
+        width:auto !important;
+        min-width:0 !important;
+
+        transform:none !important;
+        left:auto !important;
+        position:relative !important;
+    }
+
+    /* Widebody rechts halten */
+    #aircraftClass{
+        justify-self:end !important;
+        text-align:right !important;
+        white-space:nowrap !important;
+    }
+}
+
+
+
+/* ======================================================
+   SINGLE CLEAN AIRCRAFT ALIGN FIX
+====================================================== */
+
+:root{
+    --jfLogoCircle: 44px;
+}
+
+/* Reihen */
+.airlineMini,
+.manufacturerMini{
+    display:grid !important;
+    grid-template-columns: var(--jfLogoCircle) minmax(0,1fr) auto !important;
+    align-items:center !important;
+    column-gap:14px !important;
+}
+
+/* Kreise */
+#airlineLogoImg,
+#manufacturerLogoImg,
+#manufacturerLogoText{
+    width:var(--jfLogoCircle) !important;
+    height:var(--jfLogoCircle) !important;
+    min-width:var(--jfLogoCircle) !important;
+    min-height:var(--jfLogoCircle) !important;
+    max-width:var(--jfLogoCircle) !important;
+    max-height:var(--jfLogoCircle) !important;
+
+    border-radius:999px !important;
+    object-fit:contain !important;
+    object-position:center !important;
+
+    overflow:hidden !important;
+    flex-shrink:0 !important;
+}
+
+/* Airline Text */
+#airline{
+    margin:0 !important;
+    padding:0 !important;
+    line-height:1.05 !important;
+    justify-self:start !important;
+    text-align:left !important;
+}
+
+/* Airbus Text */
+#aircraftTypeText{
+    margin:0 !important;
+    padding:0 !important;
+    line-height:1.05 !important;
+
+    justify-self:start !important;
+    text-align:left !important;
+
+    transform:none !important;
+    left:auto !important;
+}
+
+/* Klasse rechts */
+#aircraftClass{
+    justify-self:end !important;
+    text-align:right !important;
+    white-space:nowrap !important;
+}
+
+/* Landscape */
+@media (orientation:landscape){
+
+    :root{
+        --jfLogoCircle: 40px;
+    }
+
+    .airlineMini,
+    .manufacturerMini{
+        column-gap:12px !important;
+    }
+
+    #airline,
+    #aircraftTypeText{
+        font-size:.95em !important;
+    }
+}
+
+
+
+/* ======================================================
+   HARD LEFT AIRBUS FIX
+====================================================== */
+
+@media (orientation:landscape){
+
+    /* zweite Reihe exakt links/rechts */
+    .manufacturerMini{
+        display:flex !important;
+        align-items:center !important;
+        gap:14px !important;
+    }
+
+    /* Airbus Text ganz links */
+    #aircraftTypeText{
+        flex:1 1 auto !important;
+
+        margin:0 !important;
+        padding:0 !important;
+
+        text-align:left !important;
+
+        transform:none !important;
+        left:0 !important;
+        right:auto !important;
+
+        position:static !important;
+    }
+
+    /* Widebody rechts fest */
+    #aircraftClass{
+        margin-left:auto !important;
+        text-align:right !important;
+        white-space:nowrap !important;
+    }
+}
+