:root {
	--h5-desktop-width: 480px;
	--h5-brand-blue: #2093fe;
	--h5-brand-blue-dark: #072184;
	--h5-brand-blue-soft: #a9d5fa;
	--h5-brand-surface: #f4f7ff;
}

html,
body {
	margin: 0;
	min-height: 100vh;
	background: #c8daf4;
}

@media (min-width: 481px) {
	html {
		background: linear-gradient(
			180deg,
			#072184 0%,
			#2a5fad 16%,
			#7eb3e8 32%,
			#eef4fc 50%,
			#dce9f8 70%,
			#a9d5fa 88%,
			#072184 100%
		);
		background-attachment: fixed;
	}

	body {
		background: transparent;
	}

	uni-app {
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
		margin: 0 auto !important;
		background: var(--h5-brand-surface) !important;
		box-shadow: 0 0 48px rgba(22, 56, 102, 0.22);
		min-height: 100vh;
		position: relative;
		overflow-x: hidden;
	}

	.uni-app--showlayout uni-page,
	.uni-app--showlayout uni-page-wrapper,
	.uni-app--showlayout uni-page-body {
		background: var(--h5-brand-surface);
	}

	/* 顶部导航栏 */
	uni-app .u-navbar--fixed {
		left: 50% !important;
		right: auto !important;
		top: 0 !important;
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
		transform: translateX(-50%);
		box-sizing: border-box;
	}

	/* 底部 uView TabBar */
	uni-app .u-tabbar__content.u-tabbar--fixed {
		left: 50% !important;
		right: auto !important;
		bottom: 0 !important;
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
		transform: translateX(-50%);
		box-sizing: border-box;
		box-shadow: 0 -4px 18px rgba(22, 56, 102, 0.08);
	}

	/* 自定义底部 TabBar */
	uni-app .custom-tabbar {
		left: 50% !important;
		right: auto !important;
		bottom: 0 !important;
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
		transform: translateX(-50%);
		box-sizing: border-box;
		box-shadow: 0 -4px 18px rgba(22, 56, 102, 0.08);
	}

	/* 代理记录页等 fixed 顶栏（普通文档流日期栏勿加此类名） */
	uni-app .date-tab.date-tab--fixed {
		left: 50% !important;
		right: auto !important;
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
		transform: translateX(-50%);
		box-sizing: border-box;
	}

	/* 聊天页背景图限制在内容区 */
	uni-app .content:before {
		left: 50% !important;
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
		transform: translateX(-50%);
	}

	/* 聊天室：会员信息栏（头像/余额/开奖） */
	uni-app .top-card {
		left: calc(50% - var(--h5-desktop-width) / 2) !important;
		right: auto !important;
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
		transform: none !important;
		box-sizing: border-box;
	}

	/* 聊天室：底部输入/下注栏内容 */
	uni-app .tabbar {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box;
		padding: 0 8px;
	}

	uni-app .u-tabbar__content__item-wrapper {
		width: 100%;
		box-sizing: border-box;
	}

	/* 聊天室：回到底部按钮 */
	uni-app .bottom-btn {
		right: calc(50% - var(--h5-desktop-width) / 2 + 10px) !important;
		left: auto !important;
	}

	/* 客服悬浮按钮拖拽区域 */
	#app .movable-area,
	.movable-area,
	uni-movable-area.movable-area,
	uni-app .movable-area,
	uni-app .room-menu-area {
		left: calc(50% - var(--h5-desktop-width) / 2) !important;
		right: auto !important;
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
		transform: none !important;
		overflow: hidden;
	}

	uni-app .room-menu-area {
		overflow: visible !important;
	}

	uni-app .movable-area {
		overflow: visible !important;
	}

	uni-app .kefu-card {
		margin-right: 0 !important;
	}

	uni-app .online-contact,
	uni-app .room-menu-fab {
		width: 100% !important;
		height: auto !important;
	}

	uni-app .kefu-track,
	uni-app .room-menu-track {
		width: 100% !important;
		display: flex !important;
		justify-content: flex-end !important;
	}

	uni-movable-view.room-menu-fab,
	uni-movable-view.online-contact {
		width: 100% !important;
		display: block !important;
		height: auto !important;
		left: 0 !important;
	}

	/* 弹窗遮罩与下注面板限制在内容区 */
	.u-overlay,
	uni-app .u-overlay {
		left: calc(50% - var(--h5-desktop-width) / 2) !important;
		right: auto !important;
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
	}

	.u-popup .u-transition,
	uni-app .u-popup .u-transition {
		left: calc(50% - var(--h5-desktop-width) / 2) !important;
		right: auto !important;
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
	}

	.u-popup__content,
	uni-app .u-popup__content {
		width: 100% !important;
		max-width: var(--h5-desktop-width) !important;
		box-sizing: border-box;
		overflow-x: hidden;
	}

	/* 快速投注弹窗内容 */
	uni-app .bet-popup-shell,
	uni-app .bet-popup-dialog,
	uni-app .popup-bottom,
	uni-app .popup-bottom-flex,
	uni-app .bet-card,
	uni-app .jnd28bet-new,
	uni-app .fc3d-bet-panel {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box;
	}

	uni-app .jnd28bet-new__body,
	uni-app .fc3d-bet-body {
		height: 280px !important;
		max-height: 45vh !important;
	}

	/* 快捷投注弹窗：限制在内容区并防止拖拽拉扯 */
	uni-app .u-popup__content:has(.bet-popup-dialog),
	uni-app .u-popup .u-transition:has(.bet-popup-dialog) {
		overscroll-behavior: none !important;
		touch-action: none !important;
	}

	uni-app .u-overlay:has(+ .u-transition .bet-popup-dialog),
	uni-app .u-overlay {
		touch-action: none !important;
	}

	uni-app .jnd28bet-new__nav,
	uni-app .fc3d-left-menu {
		width: 80px !important;
	}

	uni-app .jnd28bet-new__nav-item,
	uni-app .fc3d-left-item {
		min-height: 50px !important;
		font-size: 14px !important;
	}

	uni-app .jnd28bet-new__cell,
	uni-app .fc3d-bet-cell {
		min-height: 70px !important;
	}

	uni-app .jnd28bet-new__cell-title,
	uni-app .fc3d-bet-cell__label {
		font-size: 20px !important;
	}

	uni-app .fc3d-bet-cell__odd {
		font-size: 14px !important;
	}

	uni-app .fc3d-left-item__txt {
		font-size: 15px !important;
	}

	uni-app .fc3d-left-item--switch .fc3d-left-item__txt {
		font-size: 14px !important;
	}

	uni-app .jnd28bet-new__left {
		width: 80px !important;
	}

	uni-app .jnd28bet-new__summary,
	uni-app .fc3d-bet-foot__summary {
		font-size: 13px !important;
	}

	uni-app .tabbar {
		width: 100% !important;
		max-width: 100% !important;
		padding: 0 8px !important;
		box-sizing: border-box !important;
	}

	uni-app .tabbar .btn {
		min-width: 86px !important;
		width: auto !important;
		margin-left: 8px !important;
		font-size: 14px !important;
		line-height: 36px !important;
	}

	uni-app .tabbar .send-btn {
		width: 64px !important;
		line-height: 36px !important;
		font-size: 14px !important;
	}

	uni-app .popup-top-flex > scroll-view:first-child,
	uni-app .popup-top-flex > uni-scroll-view:first-child {
		width: 24% !important;
		height: 540rpx !important;
		flex-shrink: 0;
	}

	uni-app .popup-top-flex > scroll-view:last-child,
	uni-app .popup-top-flex > uni-scroll-view:last-child {
		width: 76% !important;
		height: 540rpx !important;
		flex: 1;
	}

	uni-app .bet-card-top {
		width: 100% !important;
		box-sizing: border-box;
		padding: 0 8px;
	}

	uni-app .bet-card-top-left {
		flex: 1 !important;
		width: 0 !important;
		min-width: 0 !important;
	}

	uni-app .bet-card-top-left-input {
		width: calc(100% - 60rpx) !important;
	}

	uni-app .bet-num-list-center {
		flex: 1 !important;
		width: 0 !important;
		min-width: 0 !important;
		overflow-x: auto !important;
		-webkit-overflow-scrolling: touch;
		touch-action: pan-x;
	}

	uni-app .bet-num-list-center .uni-scroll-view,
	uni-app .bet-num-list-center scroll-view {
		width: 100% !important;
	}

	/* 首页公告弹窗：固定 330px 宽，居中，不撑满 480px 内容区 */
	uni-app .u-popup__content:has(.notice-popup-dialog),
	uni-app .u-popup .u-transition:has(.notice-popup-dialog) {
		width: auto !important;
		max-width: 330px !important;
		left: 50% !important;
		right: auto !important;
		transform: translateX(-50%) !important;
		background: transparent !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
	}

	uni-app .notice-popup-dialog {
		width: 330px !important;
		max-width: calc(var(--h5-desktop-width) - 32px) !important;
	}

	uni-app .notice-popup-dialog__scroll,
	uni-app .notice-popup-dialog__scroll--h5 {
		height: auto !important;
		min-height: 0 !important;
		max-height: 250px !important;
		overflow-y: auto !important;
	}

	uni-app .notice-popup-dialog__cover-wrap {
		height: auto !important;
		max-height: none !important;
	}

	uni-app .notice-popup-dialog__cover {
		width: 100% !important;
		height: auto !important;
		object-fit: contain;
	}

	uni-app .notice-popup-dialog__title {
		font-size: 17px !important;
	}

	uni-app .notice-popup-dialog__footer {
		padding-top: 14px !important;
	}

	uni-app .notice-popup-dialog__btn {
		font-size: 16px !important;
		line-height: 44px !important;
		border-radius: 22px !important;
	}

	/* 咪奖弹窗：桌面模式限制在内容区并居中 */
	uni-app .u-popup__content:has(.mj-popup-dialog),
	uni-app .u-popup .u-transition:has(.mj-popup-dialog) {
		width: auto !important;
		max-width: var(--h5-desktop-width) !important;
		left: 50% !important;
		right: auto !important;
		transform: translateX(-50%) !important;
		background: transparent !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
	}

	uni-app .mj-popup-dialog {
		width: calc(var(--h5-desktop-width) - 32px) !important;
		max-width: calc(var(--h5-desktop-width) - 32px) !important;
		height: auto !important;
		min-height: 320px !important;
		margin: 0 auto !important;
		background-size: 100% 100% !important;
		box-sizing: border-box !important;
	}

	/* 玩法规则弹窗：桌面模式居中 */
	uni-app .u-popup__content:has(.rule-popup-dialog),
	uni-app .u-popup .u-transition:has(.rule-popup-dialog) {
		width: auto !important;
		max-width: var(--h5-desktop-width) !important;
		left: 50% !important;
		right: auto !important;
		transform: translateX(-50%) !important;
		background: transparent !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
	}

	uni-app .rule-popup-dialog {
		width: calc(var(--h5-desktop-width) - 32px) !important;
		max-width: calc(var(--h5-desktop-width) - 32px) !important;
		height: auto !important;
		max-height: calc(100vh - 48px) !important;
		box-sizing: border-box !important;
		margin: 0 auto !important;
	}

	uni-app .rule-popup-dialog scroll-view,
	uni-app .rule-popup-dialog uni-scroll-view {
		height: calc(100vh - 160px) !important;
		max-height: 520px !important;
	}

	/* 走势页 tab 栏限制在内容区 */
	uni-app .record-tab-bar {
		left: calc(50% - var(--h5-desktop-width) / 2) !important;
		right: auto !important;
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
		box-sizing: border-box !important;
	}

	uni-app .content.content--page-lock,
	uni-app .content.content--mj-open {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		height: auto !important;
		min-height: 100vh;
	}

	/* 下注/聊天等全宽弹窗仍走下方通用规则；删除旧 popup-card 覆盖 */
	/* 系统 TabBar（若启用） */
	.uni-app--showlayout + uni-tabbar.uni-tabbar-bottom,
	.uni-app--showlayout + uni-tabbar.uni-tabbar-bottom .uni-tabbar,
	.uni-app--showlayout + uni-tabbar.uni-tabbar-top,
	.uni-app--showlayout + uni-tabbar.uni-tabbar-top .uni-tabbar {
		left: 50% !important;
		right: auto !important;
		width: var(--h5-desktop-width) !important;
		max-width: var(--h5-desktop-width) !important;
		transform: translateX(-50%);
	}
}