/* NEW_IMPLEMENTATION responsive adapter. Source art and the 32:24 tile projection are unchanged. */
body [data-game-fullscreen] {
	min-width: 82px !important;
	min-height: 44px !important;
	width: auto !important;
	font-size: 12px !important;
	white-space: nowrap;
}
@media (max-width: 950px) and (orientation: portrait) {
	/* An embedded fullscreen page must retain its exit after rotation. */
	body.lk-fullscreen.embedded .topbar {
		display: flex;
	}
	body.lk-fullscreen.embedded .game-shell {
		height: calc(var(--mobile-height, 100dvh) - 44px);
	}
}
/* Local fallback mirrors the portal's shared class contract, including portrait and desktop. */
html.game-screen-expanded {
	position: fixed !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100dvh !important;
	overflow: hidden !important;
	background: #080d10;
}
html.game-screen-expanded body {
	width: 100% !important;
	max-width: none !important;
	height: 100dvh !important;
	max-height: 100dvh !important;
	overflow: hidden !important;
	margin: 0 !important;
}
html:fullscreen,
html:-webkit-full-screen {
	background: #080d10;
}

@media (max-width: 950px) and (orientation: landscape) {
	body.lk-fullscreen {
		--lk-landscape-top: env(safe-area-inset-top, 0px);
		--lk-landscape-bottom: env(safe-area-inset-bottom, 0px);
		--lk-landscape-left: env(safe-area-inset-left, 0px);
		--lk-landscape-right: env(safe-area-inset-right, 0px);
		width: 100%;
		height: var(--mobile-height, 100dvh);
		min-height: 0;
		overflow: hidden;
	}

	body.lk-fullscreen .topbar {
		position: fixed;
		top: calc(var(--lk-landscape-top) + 4px);
		right: calc(var(--lk-landscape-right) + 4px);
		left: auto;
		z-index: 30;
		display: flex;
		align-items: center;
		gap: 4px;
		width: max-content;
		max-width: calc(
			100% -
			var(--lk-landscape-left) -
			var(--lk-landscape-right) -
			8px
		);
		height: 44px;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 6px;
		background: #15190fed;
		box-shadow: 0 1px 6px #0008;
	}
	body.lk-fullscreen .topbar .brand,
	body.lk-fullscreen .topbar .connection > i,
	body.lk-fullscreen .topbar .connection > span {
		display: none;
	}
	body.lk-fullscreen .topbar .portal-link {
		min-width: 44px;
		min-height: 44px;
		height: 44px;
		padding: 0 7px;
		gap: 3px;
		white-space: nowrap;
	}
	body.lk-fullscreen .topbar .portal-link::after {
		font-size: 11px;
	}
	body.lk-fullscreen .topbar .connection {
		gap: 0;
	}
	body.lk-fullscreen .topbar .connection button {
		width: 44px;
		min-width: 44px;
		height: 44px;
		min-height: 44px;
		margin: 0;
		font-size: 19px;
	}
	body.lk-fullscreen .topbar .connection [data-game-fullscreen] {
		width: auto;
		min-width: 82px;
		padding: 6px 8px;
		font-size: 12px;
		line-height: 1.2;
		white-space: nowrap;
	}

	body.lk-fullscreen .game-shell,
	body.lk-fullscreen .game-shell.classic {
		position: relative;
		width: 100%;
		max-width: none;
		height: var(--mobile-height, 100dvh);
		max-height: var(--mobile-height, 100dvh);
		min-height: 0;
		margin: 0;
		padding: 0;
		border: 0;
		box-shadow: none;
		overflow: hidden;
	}
	body.lk-fullscreen .game-shell .viewport {
		flex: 1 1 0;
		width: 100%;
		min-height: 0;
		height: auto;
		max-height: none;
		aspect-ratio: auto;
		border: 0;
	}
	body.lk-fullscreen .location {
		top: calc(var(--lk-landscape-top) + 6px);
		left: calc(var(--lk-landscape-left) + 6px);
		max-width: calc(
			100% -
			var(--lk-landscape-left) -
			var(--lk-landscape-right) -
			264px
		);
		padding: 5px 7px;
	}
	body.lk-fullscreen .world-meta {
		top: calc(var(--lk-landscape-top) + 52px);
		right: calc(var(--lk-landscape-right) + 6px);
		z-index: 5;
		max-width: calc(
			100% -
			var(--lk-landscape-left) -
			var(--lk-landscape-right) -
			12px
		);
	}
	body.lk-fullscreen .world-meta details summary {
		display: flex;
		align-items: center;
		min-width: 44px;
		min-height: 44px;
		padding: 4px 7px;
	}
	body.lk-fullscreen .world-meta details ul {
		max-width: min(
			250px,
			calc(100vw - var(--lk-landscape-left) - var(--lk-landscape-right) - 16px)
		);
		max-height: max(
			44px,
			calc(
				var(--mobile-height, 100dvh) -
				192px -
				var(--lk-landscape-top) -
				var(--lk-landscape-bottom)
			)
		);
		overflow: auto;
		overscroll-behavior: contain;
	}
	body.lk-fullscreen .toast {
		top: calc(var(--lk-landscape-top) + 54px);
		max-width: calc(
			100% -
			var(--lk-landscape-left) -
			var(--lk-landscape-right) -
			24px
		);
		padding: 8px 12px;
	}

	body.lk-fullscreen .game-shell .hud {
		flex: 0 0 52px;
		height: 52px;
		min-height: 52px;
		max-height: 52px;
		grid-template-columns: minmax(68px, 0.7fr) minmax(108px, 1fr) minmax(
				176px,
				2fr
			);
		grid-template-rows: 44px;
		gap: 4px;
		padding: 4px max(6px, var(--lk-landscape-right)) 4px
			max(6px, var(--lk-landscape-left));
		border-width: 0;
	}
	body.lk-fullscreen .game-shell .hud .character {
		grid-column: 1;
		grid-row: 1;
		min-width: 0;
		padding: 0;
		gap: 0;
	}
	body.lk-fullscreen .hud .character > div {
		min-width: 0;
		max-width: 100%;
	}
	body.lk-fullscreen .hud .character strong {
		max-width: 100%;
		font-size: 11px;
	}
	body.lk-fullscreen .hud .character small {
		margin-top: 1px;
		font-size: 10px;
	}
	body.lk-fullscreen .game-shell .hud .vitals {
		grid-column: 2;
		grid-row: 1;
		min-width: 0;
		width: 100%;
		padding-top: 3px;
	}
	body.lk-fullscreen .hud .vital label {
		width: 18px;
		font-size: 9px;
	}
	body.lk-fullscreen .hud .vital .meter {
		min-width: 0;
		height: 13px;
	}
	body.lk-fullscreen .game-shell .hud .quickbar {
		grid-column: 3;
		grid-row: 1;
		width: 100%;
		height: 44px;
		min-width: 0;
		gap: 0;
	}
	body.lk-fullscreen .hud .quickbar button {
		flex: 1 1 44px;
		width: 44px;
		min-width: 44px;
		min-height: 44px;
		height: 44px;
		padding: 1px;
		gap: 3px;
		font-size: 10px;
	}
	body.lk-fullscreen .hud .quickbar button span {
		font-size: 18px;
	}
	body.lk-fullscreen .mobile-tabs {
		flex: 0 0 calc(44px + var(--lk-landscape-bottom));
		height: calc(44px + var(--lk-landscape-bottom));
		min-height: calc(44px + var(--lk-landscape-bottom));
		padding: 0 var(--lk-landscape-right) var(--lk-landscape-bottom)
			var(--lk-landscape-left);
	}
	body.lk-fullscreen .mobile-tabs button {
		min-width: 44px;
		min-height: 44px;
		height: 44px;
		padding: 0 4px;
		font-size: 11px;
	}

	body.lk-fullscreen .touch-pad {
		left: max(8px, var(--lk-landscape-left));
		bottom: 8px;
		width: 140px;
		height: 140px;
		grid-template-columns: repeat(3, 44px);
		grid-template-rows: repeat(3, 44px);
		gap: 4px;
	}
	body.lk-fullscreen .touch-pad button {
		width: 44px;
		min-width: 44px;
		height: 44px;
		min-height: 44px;
		padding: 0;
	}
	body.lk-fullscreen .touch-attack {
		right: max(10px, var(--lk-landscape-right));
		bottom: 10px;
		width: 64px;
		height: 64px;
		min-width: 44px;
		min-height: 44px;
	}

	body.lk-fullscreen .game-shell .bottom-panel {
		left: calc(var(--lk-landscape-left) + 6px);
		right: calc(var(--lk-landscape-right) + 6px);
		top: calc(52px + var(--lk-landscape-top));
		bottom: calc(44px + var(--lk-landscape-bottom));
		height: auto;
		min-height: 0;
		max-height: none;
		margin: 0;
		overflow: hidden;
	}
	body.lk-fullscreen .game-shell .bottom-panel .chat-header,
	body.lk-fullscreen .game-shell .bottom-panel .panel-tabs {
		flex: 0 0 44px;
		min-height: 44px;
	}
	body.lk-fullscreen .panel-close,
	body.lk-fullscreen .chat-header button,
	body.lk-fullscreen .leave-button {
		min-width: 44px;
		min-height: 44px;
		flex-shrink: 0;
	}
	body.lk-fullscreen .game-shell .bottom-panel .panel-body,
	body.lk-fullscreen .game-shell .bottom-panel .chat-log {
		min-height: 0;
		max-height: none;
		overflow: auto;
		overscroll-behavior: contain;
	}
	body.lk-fullscreen.mobile-menu-open .game-shell .hud,
	body.lk-fullscreen.mobile-chat-open .game-shell .hud,
	body.lk-fullscreen.mobile-menu-open .touch-pad,
	body.lk-fullscreen.mobile-chat-open .touch-pad,
	body.lk-fullscreen.mobile-menu-open .touch-attack,
	body.lk-fullscreen.mobile-chat-open .touch-attack {
		display: none;
	}
	body.lk-fullscreen .game-shell .bottom-panel .chat-input {
		flex: 0 0 48px;
		min-height: 48px;
	}
	body.lk-fullscreen dialog {
		width: min(
			540px,
			calc(100% - var(--lk-landscape-left) - var(--lk-landscape-right) - 16px)
		);
		max-height: calc(
			var(--mobile-height, 100dvh) -
			var(--lk-landscape-top) -
			var(--lk-landscape-bottom) -
			16px
		);
		margin: auto;
		padding: 16px;
		overflow: auto;
		overscroll-behavior: contain;
	}
	body.lk-fullscreen dialog button,
	body.lk-fullscreen .dialog-close {
		min-width: 44px;
		min-height: 44px;
	}
	body.lk-fullscreen .dialog-close {
		position: sticky;
		top: 0;
		float: right;
		z-index: 1;
		background: #211f1bf5;
	}
	body.lk-fullscreen dialog h2 {
		padding-right: 44px;
	}

	/* A visual-viewport keyboard shrink gives the focused drawer space while exit/tabs remain reachable. */
	body.lk-fullscreen:has(.bottom-panel input:focus) .game-shell .hud {
		display: none;
	}
	body.lk-fullscreen:has(.bottom-panel input:focus) .game-shell .bottom-panel {
		bottom: calc(48px + var(--lk-landscape-bottom));
		height: calc(
			var(--mobile-height, 100dvh) -
			100px -
			var(--lk-landscape-top) -
			var(--lk-landscape-bottom)
		);
		max-height: calc(
			var(--mobile-height, 100dvh) -
			100px -
			var(--lk-landscape-top) -
			var(--lk-landscape-bottom)
		);
	}
	body.lk-fullscreen:has(.bottom-panel input:focus) .touch-pad,
	body.lk-fullscreen:has(.bottom-panel input:focus) .touch-attack {
		display: none;
	}
}

@media (max-width: 568px) and (orientation: landscape) {
	body.lk-fullscreen .hud .quickbar button span {
		display: none;
	}
	body.lk-fullscreen .hud .quickbar button {
		font-size: 11px;
	}
}