.qm-task-hub {
	--qm-task-primary: #20bcc5;
	--qm-task-primary-hover: #12aab4;
	--qm-task-primary-soft: #dff8fa;
	--qm-task-primary-pale: #eefcfd;
	--qm-task-top: #d9f1ff;
	--qm-task-sky: #dff4ff;
	--qm-task-sky-deep: #bfeaff;
	--qm-task-white: #ffffff;
	--qm-task-page: #f7fafc;
	--qm-task-gray-100: #eef2f5;
	--qm-task-gray-300: #cbd5dc;
	--qm-task-gray-500: #84909b;
	--qm-task-gray-700: #46525d;
	--qm-task-gray-900: #242c33;
	--qm-task-reward: #f6bb32;
	--qm-task-reward-soft: #fff6d8;
	--qm-task-danger: #f46b68;
	--qm-task-icon-amber: #f2a23c;
	--qm-task-icon-emerald: #31b886;
	--qm-task-icon-blue: #4f83ef;
	--qm-task-icon-violet: #9b63e9;
	--qm-task-icon-cyan: #18a9d3;
	--qm-task-icon-mint: #14b99a;
	--qm-task-points: #c95d14;
	--qm-task-fluid-blue: #a9dcf7;
	--qm-task-fluid-cyan: #8edfe8;
	--qm-task-fluid-mint: #b2e9ee;
	--qm-task-fluid-sky: #c4e5fa;
	--qm-task-fluid-base: #edf9ff;
	--qm-task-fluid-clear: rgba(237, 249, 255, 0);
	--qm-task-light-streak: rgba(255, 255, 255, 0.58);
	--qm-task-light-streak-soft: rgba(255, 255, 255, 0.26);
	--qm-task-glass: rgba(255, 255, 255, 0.38);
	--qm-task-glass-soft: rgba(255, 255, 255, 0.72);
	--qm-task-glass-border: rgba(255, 255, 255, 0.68);
	--qm-task-shadow-card: 0 8px 22px rgba(69, 100, 115, 0.08), 0 2px 7px rgba(69, 100, 115, 0.05);
	--qm-task-shadow-button: 0 8px 18px rgba(32, 188, 197, 0.2), 0 2px 6px rgba(32, 188, 197, 0.12);
	--qm-task-shadow-glass: 0 12px 30px rgba(55, 126, 153, 0.1), 0 2px 8px rgba(55, 126, 153, 0.06);
	--qm-task-transition: 0.24s ease;
	position: relative;
	isolation: isolate;
	display: none;
	gap: 18px;
	min-width: 0;
	padding: 0 0 24px;
	overflow: hidden;
	background: var(--qm-task-white);
	color: var(--qm-task-gray-700);
}

.qm-task-hub::before {
	position: absolute;
	z-index: 0;
	top: -92px;
	left: -8%;
	width: 116%;
	height: 760px;
	background:
		radial-gradient(ellipse at 8% 18%, var(--qm-task-fluid-blue) 0, var(--qm-task-fluid-clear) 34%),
		radial-gradient(ellipse at 84% 12%, var(--qm-task-fluid-mint) 0, var(--qm-task-fluid-clear) 31%),
		radial-gradient(ellipse at 72% 62%, var(--qm-task-fluid-cyan) 0, var(--qm-task-fluid-clear) 36%),
		radial-gradient(ellipse at 28% 70%, var(--qm-task-fluid-sky) 0, var(--qm-task-fluid-clear) 38%),
		linear-gradient(145deg, var(--qm-task-fluid-base), var(--qm-task-primary-pale));
	content: "";
	filter: blur(48px) saturate(1.08);
	opacity: 0.78;
	pointer-events: none;
	transform: scale(1.08);
}

.qm-task-hub::after {
	position: absolute;
	z-index: 0;
	top: 24px;
	left: 0;
	width: 100%;
	height: 520px;
	background:
		linear-gradient(
			124deg,
			transparent 0 18%,
			var(--qm-task-light-streak) 18.2% 18.45%,
			transparent 18.7% 100%
		),
		linear-gradient(
			132deg,
			transparent 0 56%,
			var(--qm-task-light-streak-soft) 56.2% 56.55%,
			transparent 56.8% 100%
		),
		linear-gradient(
			116deg,
			transparent 0 78%,
			var(--qm-task-light-streak) 78.15% 78.35%,
			transparent 78.6% 100%
		);
	content: "";
	opacity: 0.68;
	pointer-events: none;
}

.qm-task-hub > * {
	position: relative;
	z-index: 1;
}

.qm-task-hub.is-active {
	display: flex;
	flex-direction: column;
}

.qm-task-hub,
.qm-task-hub *,
.qm-task-hub *::before,
.qm-task-hub *::after {
	box-sizing: border-box;
}

.qm-task-hub a {
	text-decoration: none;
}

.qm-task-hub__topbar {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr) 64px;
	align-items: center;
	min-height: 58px;
	padding: 7px 16px;
	border-bottom: 1px solid transparent;
	background: transparent;
}

.qm-task-hub__topbar h1 {
	margin: 0;
	color: var(--qm-task-gray-900);
	font-size: 24px;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: 0;
	text-align: center;
}

.qm-task-hub__back,
.qm-task-hub__rules {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	min-height: 40px;
	border-radius: 6px;
	color: var(--qm-task-gray-700);
	font-size: 15px;
	transition: color var(--qm-task-transition), opacity var(--qm-task-transition), transform var(--qm-task-transition);
}

.qm-task-hub__back {
	font-size: 19px;
}

.qm-task-hub__rules {
	justify-self: end;
}

.qm-task-hub__back:hover,
.qm-task-hub__rules:hover {
	color: var(--qm-task-primary);
}

.qm-task-hub__back:active,
.qm-task-hub__rules:active {
	opacity: 0.72;
	transform: scale(0.95);
}

.qm-task-hub__checkin {
	position: relative;
	min-height: 336px;
	padding: 18px 28px 24px;
	overflow: hidden;
	border-radius: 14px;
	background: transparent;
}

.qm-task-hub__rule-note {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 42px;
	padding: 8px 14px;
	border: 1px solid var(--qm-task-glass-border);
	border-radius: 10px;
	background: var(--qm-task-glass);
	-webkit-backdrop-filter: blur(18px) saturate(1.24);
	backdrop-filter: blur(18px) saturate(1.24);
	box-shadow: var(--qm-task-shadow-glass);
	color: var(--qm-task-gray-700);
	font-size: 13px;
	line-height: 1.5;
}

.qm-task-hub__rule-note i {
	color: var(--qm-task-primary);
	font-size: 16px;
}

.qm-task-hub__stage {
	display: grid;
	grid-template-columns: minmax(108px, 1fr) minmax(220px, 320px) minmax(108px, 1fr);
	align-items: center;
	gap: 14px;
	min-height: 222px;
}

.qm-task-hub__visual {
	position: relative;
	align-self: stretch;
	min-height: 220px;
}

.qm-task-hub__visual > img {
	position: absolute;
	left: 50%;
	top: 50%;
	display: block;
	width: min(320px, 116%);
	height: 230px;
	object-fit: contain;
	filter: hue-rotate(132deg) saturate(0.86) brightness(1.08);
	transform: translate(-50%, -50%);
}

.qm-task-hub__metric {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-self: start;
	gap: 3px;
	min-width: 108px;
	padding: 10px 14px;
	border: 1px solid var(--qm-task-white);
	border-radius: 10px;
	background: var(--qm-task-glass-soft);
	box-shadow: var(--qm-task-shadow-card);
}

.qm-task-hub__metric--end {
	align-items: flex-end;
	justify-self: end;
	text-align: right;
}

.qm-task-hub__metric span {
	color: var(--qm-task-gray-500);
	font-size: 13px;
	line-height: 1.5;
}

.qm-task-hub__metric strong {
	max-width: 148px;
	overflow: hidden;
	color: var(--qm-task-gray-900);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.4;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.qm-task-hub__metric small {
	margin-left: 3px;
	font-size: 12px;
	font-weight: 400;
}

.qm-task-hub__checkin-btn,
.qm-task-hub__primary-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	min-height: 42px;
	padding: 9px 20px;
	border: 0;
	border-radius: 6px;
	background: var(--qm-task-primary);
	box-shadow: var(--qm-task-shadow-button);
	color: var(--qm-task-white);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.5;
	transition:
		background-color var(--qm-task-transition),
		opacity var(--qm-task-transition),
		transform var(--qm-task-transition);
}

.qm-task-hub__checkin-btn {
	position: absolute;
	left: 50%;
	bottom: 17px;
	min-width: 136px;
	transform: translateX(-50%);
}

.qm-task-hub__checkin-btn:not(:disabled):hover,
.qm-task-hub__primary-btn:hover {
	background: var(--qm-task-primary-hover);
	color: var(--qm-task-white);
}

.qm-task-hub__checkin-btn:not(:disabled):active {
	transform: translateX(-50%) scale(0.97);
}

.qm-task-hub__primary-btn:active {
	transform: scale(0.97);
}

.qm-task-hub__checkin-btn:disabled,
.qm-task-hub__checkin-btn.is-complete {
	cursor: default;
	background: var(--qm-task-white);
	box-shadow: var(--qm-task-shadow-card);
	color: var(--qm-task-primary);
}

.qm-task-hub__checkin-btn.is-loading {
	opacity: 0.66;
}

.qm-task-hub__rewards {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 10px;
	margin: -2px 18px 0;
}

.qm-task-hub__reward {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3px;
	min-width: 0;
	padding: 10px 4px 9px;
	border: 1px solid var(--qm-task-gray-100);
	border-radius: 10px;
	background: var(--qm-task-white);
	box-shadow: var(--qm-task-shadow-card);
	text-align: center;
}

.qm-task-hub__reward-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: var(--qm-task-reward-soft);
	color: var(--qm-task-reward);
	font-size: 22px;
}

.qm-task-hub__reward-icon img {
	display: block;
	width: 30px;
	height: 30px;
	object-fit: contain;
}

.qm-task-hub__reward strong,
.qm-task-hub__reward small {
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.qm-task-hub__reward strong {
	color: var(--qm-task-gray-700);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.45;
}

.qm-task-hub__reward small {
	color: var(--qm-task-gray-500);
	font-size: 12px;
	font-weight: 400;
	line-height: 1.5;
}

.qm-task-hub__reward.is-checked {
	border-color: var(--qm-task-primary);
	background: var(--qm-task-primary-pale);
}

.qm-task-hub__reward.is-checked .qm-task-hub__reward-icon {
	background: var(--qm-task-primary-soft);
	color: var(--qm-task-primary);
}

.qm-task-hub__featured {
	display: grid;
	grid-template-columns: 54px minmax(0, 1fr) auto;
	align-items: center;
	gap: 14px;
	margin: 0 18px;
	padding: 14px 16px;
	border: 1px solid var(--qm-task-gray-100);
	border-radius: 10px;
	background: var(--qm-task-white);
	box-shadow: var(--qm-task-shadow-card);
}

.qm-task-hub__featured-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: var(--qm-task-primary-soft);
	color: var(--qm-task-primary);
	font-size: 24px;
}

.qm-task-hub__featured-icon img {
	display: block;
	width: 36px;
	height: 36px;
	object-fit: contain;
}

.qm-task-hub__featured-copy {
	min-width: 0;
}

.qm-task-hub__featured-copy h2,
.qm-task-hub__section h2 {
	margin: 0;
	color: var(--qm-task-gray-900);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: 0;
}

.qm-task-hub__featured-copy p {
	margin: 3px 0 0;
	color: var(--qm-task-gray-500);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.5;
}

.qm-task-hub__section {
	margin: 0 18px;
	padding: 18px;
	border-radius: 14px;
	background: var(--qm-task-white);
}

.qm-task-hub__section-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 12px;
}

.qm-task-hub__section-head > span,
.qm-task-hub__section-head > div > span {
	color: var(--qm-task-gray-500);
	font-size: 13px;
	line-height: 1.5;
}

.qm-task-hub__shortcuts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin-top: 12px;
}

.qm-task-hub__shortcuts > a {
	display: grid;
	grid-template-columns: 42px minmax(0, 1fr) 16px;
	align-items: center;
	gap: 10px;
	min-height: 66px;
	padding: 10px 14px;
	border: 1px solid var(--qm-task-gray-100);
	border-radius: 10px;
	background: var(--qm-task-white);
	box-shadow: var(--qm-task-shadow-card);
	color: var(--qm-task-gray-700);
	transition: border-color var(--qm-task-transition), transform var(--qm-task-transition);
}

.qm-task-hub__shortcuts > a:hover {
	border-color: var(--qm-task-primary);
	transform: translateY(-2px);
}

.qm-task-hub__shortcuts strong {
	font-size: 15px;
	font-weight: 500;
	line-height: 1.55;
}

.qm-task-hub__shortcuts > a > i {
	color: var(--qm-task-gray-300);
}

.qm-task-hub__shortcut-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 10px;
	background: var(--qm-task-primary-soft);
	color: var(--qm-task-primary);
	font-size: 19px;
}

.qm-task-hub__shortcut-icon[data-tone="violet"] {
	background: var(--qm-task-reward-soft);
	color: var(--qm-task-reward);
}

.qm-task-hub__task-widget {
	margin: 0;
	overflow: visible;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.qm-task-hub__task-widget .qm-task-widget__summary {
	display: none;
}

.qm-task-hub__task-widget .qm-task-widget__content,
.qm-task-hub__task-widget .qm-task-widget__list {
	padding: 0;
}

.qm-task-hub__task-widget .qm-task-row {
	grid-template-columns: 34px minmax(0, 1fr) auto;
	width: 100%;
	min-height: 70px;
	padding: 10px 0;
	border-bottom: 1px solid var(--qm-task-gray-100);
}

.qm-task-hub__task-widget .qm-task-row:last-child {
	border-bottom: 0;
}

.qm-task-hub__task-widget .qm-task-row__icon {
	width: 34px;
	height: 34px;
	border-radius: 0 !important;
	background: transparent !important;
}

.qm-task-hub__task-widget .qm-task-row__icon i {
	font-size: 23px;
}

.qm-task-hub__task-widget .qm-task-row__icon--amber {
	color: var(--qm-task-icon-amber);
}

.qm-task-hub__task-widget .qm-task-row__icon--emerald {
	color: var(--qm-task-icon-emerald);
}

.qm-task-hub__task-widget .qm-task-row__icon--blue {
	color: var(--qm-task-icon-blue);
}

.qm-task-hub__task-widget .qm-task-row__icon--violet {
	color: var(--qm-task-icon-violet);
}

.qm-task-hub__task-widget .qm-task-row__icon--cyan {
	color: var(--qm-task-icon-cyan);
}

.qm-task-hub__task-widget .qm-task-row__icon--mint {
	color: var(--qm-task-icon-mint);
}

.qm-task-hub__task-widget .qm-task-row__name {
	color: var(--qm-task-gray-900);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.55;
}

.qm-task-hub__task-widget .qm-task-row__reward {
	color: var(--qm-task-points);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.5;
}

.qm-task-hub__task-widget .qm-task-row__progress {
	color: var(--qm-task-gray-500);
	font-size: 13px;
	line-height: 1.5;
}

.qm-task-hub__task-widget .qm-task-row__btn {
	min-width: 76px;
	height: 34px;
	padding: 5px 14px;
	border: 1px solid var(--qm-task-primary);
	border-radius: var(--qm-radius-pill, 999px) !important;
	background: var(--qm-task-white);
	box-shadow: none;
	color: var(--qm-task-primary);
	font-size: 13px;
	font-weight: 500;
	transition:
		background-color var(--qm-task-transition),
		color var(--qm-task-transition),
		transform var(--qm-task-transition);
}

.qm-task-hub__task-widget .qm-task-row__side {
	justify-self: end;
	margin-left: auto;
	text-align: right;
}

.qm-task-hub__task-widget .qm-task-row__btn--claim {
	background: var(--qm-task-primary);
	color: var(--qm-task-white);
}

.qm-task-hub__task-widget .qm-task-row__btn:not(:disabled):hover {
	background: var(--qm-task-primary-hover);
	color: var(--qm-task-white);
	transform: translateY(-1px);
}

.qm-task-hub__task-widget .qm-task-row__btn--disabled,
.qm-task-hub__task-widget .qm-task-row__btn--disabled:hover {
	border-color: var(--qm-task-gray-300);
	background: var(--qm-task-gray-100);
	color: var(--qm-task-gray-500);
	transform: none;
}

.qm-task-hub__task-widget .qm-task-widget__more {
	min-height: 40px;
	margin-top: 10px;
	border-radius: 6px;
	color: var(--qm-task-primary);
}

.qm-task-hub__empty {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 88px;
	color: var(--qm-task-gray-500);
	font-size: 15px;
	line-height: 1.55;
}

.qm-task-hub__history-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.12fr) minmax(260px, 0.88fr);
	gap: 18px;
}

.qm-task-hub__calendar {
	padding: 14px;
	border: 1px solid var(--qm-task-gray-100);
	border-radius: 10px;
}

.qm-task-hub__weekdays,
.qm-task-hub__days {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 6px;
}

.qm-task-hub__weekdays {
	margin-bottom: 8px;
}

.qm-task-hub__weekdays span {
	color: var(--qm-task-gray-500);
	font-size: 12px;
	line-height: 1.5;
	text-align: center;
}

.qm-task-hub__days > span,
.qm-task-hub__days > button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-width: 0;
	aspect-ratio: 1;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--qm-task-page);
	color: var(--qm-task-gray-700);
	font-size: 12px;
	line-height: 1;
}

.qm-task-hub__days > .is-placeholder {
	background: transparent;
}

.qm-task-hub__days > .is-checked {
	background: var(--qm-task-primary);
	color: var(--qm-task-white);
}

.qm-task-hub__days > .is-today {
	box-shadow: inset 0 0 0 2px var(--qm-task-primary);
}

.qm-task-hub__days > .is-makeup {
	background: var(--qm-task-reward-soft);
	color: var(--qm-task-gray-700);
}

.qm-task-hub__record-list {
	display: flex;
	flex-direction: column;
}

.qm-task-hub__record {
	display: grid;
	grid-template-columns: 38px minmax(0, 1fr) auto;
	align-items: center;
	gap: 10px;
	min-height: 58px;
	padding: 7px 0;
	border-bottom: 1px solid var(--qm-task-gray-100);
}

.qm-task-hub__record:last-child {
	border-bottom: 0;
}

.qm-task-hub__record > span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--qm-task-primary-soft);
	color: var(--qm-task-primary);
}

.qm-task-hub__record div {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.qm-task-hub__record strong,
.qm-task-hub__record b {
	color: var(--qm-task-gray-900);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.5;
}

.qm-task-hub__record small {
	color: var(--qm-task-gray-500);
	font-size: 12px;
	line-height: 1.5;
}

.qm-task-hub__record b {
	color: var(--qm-task-primary);
	text-align: right;
}

@media (max-width: 991.98px) {
	.qm-task-hub__stage {
		grid-template-columns: minmax(96px, 1fr) minmax(190px, 260px) minmax(96px, 1fr);
	}

	.qm-task-hub__history-grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 767.98px) {
	body.page-template-page-user-center:has(.qm-task-hub.is-active),
	body.qm-header-fixed.page-template-page-user-center:has(.qm-task-hub.is-active) {
		--qm-task-white: #ffffff;
		--qm-task-page: #f7fafc;
		padding-top: 0 !important;
		background: var(--qm-task-white);
	}

	body.page-template-page-user-center:has(.qm-task-hub.is-active) #qm-header {
		display: none;
	}

	.qm-user-center-root:has(.qm-task-hub.is-active),
	.qm-user-center-shell:has(.qm-task-hub.is-active),
	.qm-user-center-shell:has(.qm-task-hub.is-active) .qm-uc-main {
		width: 100%;
		max-width: none;
		margin: 0;
		padding: 0;
		background: var(--qm-task-white);
	}

	.qm-task-hub {
		gap: 16px;
		padding-bottom: 20px;
		background: var(--qm-task-white);
	}

	.qm-task-hub::before {
		top: -72px;
		left: -18%;
		width: 136%;
		height: 660px;
		filter: blur(42px) saturate(1.1);
		opacity: 0.82;
		transform: scale(1.1);
	}

	.qm-task-hub::after {
		top: 18px;
		height: 430px;
		opacity: 0.58;
	}

	.qm-task-hub__topbar {
		position: relative;
		z-index: 5;
		padding: 7px 12px;
	}

	.qm-task-hub__topbar h1 {
		font-size: 18px;
	}

	.qm-task-hub__checkin {
		min-height: 318px;
		padding: 12px 12px 22px;
		border-radius: 0;
	}

	.qm-task-hub__rule-note {
		min-height: 38px;
		padding: 7px 11px;
	}

	.qm-task-hub__stage {
		grid-template-columns: 76px minmax(150px, 1fr) 76px;
		gap: 4px;
		min-height: 220px;
	}

	.qm-task-hub__visual {
		min-height: 216px;
	}

	.qm-task-hub__visual > img {
		width: 226px;
		height: 205px;
	}

	.qm-task-hub__metric {
		min-width: 0;
		width: 76px;
		padding: 8px 6px;
	}

	.qm-task-hub__metric span {
		font-size: 12px;
	}

	.qm-task-hub__metric strong {
		max-width: 64px;
		font-size: 15px;
	}

	.qm-task-hub__checkin-btn {
		bottom: 14px;
		min-width: 120px;
		min-height: 38px;
		padding: 7px 16px;
		font-size: 14px;
	}

	.qm-task-hub__rewards {
		gap: 6px;
		margin: -22px 12px 0;
		padding: 10px 6px;
		border: 1px solid var(--qm-task-gray-100);
		border-radius: 14px;
		background: var(--qm-task-white);
		box-shadow: var(--qm-task-shadow-card);
	}

	.qm-task-hub__reward {
		gap: 2px;
		padding: 0;
		border: 0;
		background: transparent;
		box-shadow: none;
	}

	.qm-task-hub__reward.is-checked {
		background: transparent;
	}

	.qm-task-hub__reward-icon {
		width: 36px;
		height: 36px;
		font-size: 19px;
	}

	.qm-task-hub__reward-icon img {
		width: 27px;
		height: 27px;
	}

	.qm-task-hub__reward strong {
		font-size: 12px;
	}

	.qm-task-hub__reward small {
		font-size: 12px;
	}

	.qm-task-hub__featured,
	.qm-task-hub__section {
		margin-right: 12px;
		margin-left: 12px;
	}

	.qm-task-hub__featured {
		grid-template-columns: 46px minmax(0, 1fr) auto;
		gap: 10px;
		padding: 12px;
	}

	.qm-task-hub__featured-icon {
		width: 46px;
		height: 46px;
	}

	.qm-task-hub__featured-copy h2,
	.qm-task-hub__section h2 {
		font-size: 18px;
	}

	.qm-task-hub__featured-copy p {
		font-size: 12px;
	}

	.qm-task-hub__primary-btn {
		min-height: 36px;
		padding: 6px 14px;
		font-size: 13px;
	}

	.qm-task-hub__section {
		padding: 16px 0;
		border-radius: 0;
	}

	.qm-task-hub__section > h2,
	.qm-task-hub__section-head {
		padding-right: 2px;
		padding-left: 2px;
	}

	.qm-task-hub__shortcuts {
		gap: 10px;
	}

	.qm-task-hub__shortcuts > a {
		grid-template-columns: 38px minmax(0, 1fr);
		gap: 8px;
		min-height: 62px;
		padding: 9px 10px;
	}

	.qm-task-hub__shortcuts > a > i {
		display: none;
	}

	.qm-task-hub__shortcut-icon {
		width: 38px;
		height: 38px;
	}

	.qm-task-hub__task-widget .qm-task-row {
		display: grid;
		grid-template-columns: 34px minmax(0, 1fr) auto;
		gap: 10px;
	}

	.qm-task-hub__task-widget .qm-task-row__side {
		grid-column: 3;
		grid-row: 1;
		align-self: center;
		align-items: flex-end;
		justify-content: center;
		width: auto;
		margin-top: 0;
	}

	.qm-task-hub__task-widget .qm-task-row__btn {
		min-width: 68px;
		padding-right: 10px;
		padding-left: 10px;
	}

	.qm-task-hub__task-widget .qm-task-row__progress {
		display: none;
	}

	.qm-task-hub__history-grid {
		gap: 14px;
	}

	.qm-task-hub__calendar {
		padding: 12px;
	}
}

@media (max-width: 374.98px) {
	.qm-task-hub__stage {
		grid-template-columns: 68px minmax(142px, 1fr) 68px;
	}

	.qm-task-hub__metric {
		width: 68px;
		padding: 7px 4px;
	}

	.qm-task-hub__metric strong {
		max-width: 58px;
		font-size: 14px;
	}

	.qm-task-hub__visual > img {
		width: 208px;
	}

	.qm-task-hub__rewards {
		gap: 3px;
		margin-right: 8px;
		margin-left: 8px;
		padding-right: 4px;
		padding-left: 4px;
	}

	.qm-task-hub__reward-icon {
		width: 32px;
		height: 32px;
	}

	.qm-task-hub__featured,
	.qm-task-hub__section {
		margin-right: 10px;
		margin-left: 10px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.qm-task-hub *,
	.qm-task-hub *::before,
	.qm-task-hub *::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}

@media (min-width: 768px) {
	.qm-uc-desktop-workspace .qm-task-hub {
		gap: 16px;
		padding: 0;
		overflow: visible;
		background: transparent;
	}

	.qm-uc-desktop-workspace .qm-task-hub::before,
	.qm-uc-desktop-workspace .qm-task-hub::after {
		display: none;
	}

	.qm-uc-desktop-workspace .qm-task-hub__topbar {
		display: none;
	}

	.qm-uc-desktop-workspace .qm-task-hub__checkin,
	.qm-uc-desktop-workspace .qm-task-hub__featured,
	.qm-uc-desktop-workspace .qm-task-hub__section {
		margin: 0;
		border: 1px solid #e7eaed;
		border-radius: 8px;
		background: #ffffff;
		box-shadow: 0 4px 14px rgba(100, 116, 139, 0.06);
	}

	.qm-uc-desktop-workspace .qm-task-hub__checkin {
		min-height: 288px;
		padding: 18px 20px 22px;
	}

	.qm-uc-desktop-workspace .qm-task-hub__rule-note {
		border-color: #e7eaed;
		border-radius: 6px;
		background: #f8f9fa;
		box-shadow: none;
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}

	.qm-uc-desktop-workspace .qm-task-hub__stage {
		min-height: 190px;
	}

	.qm-uc-desktop-workspace .qm-task-hub__visual,
	.qm-uc-desktop-workspace .qm-task-hub__visual > img {
		min-height: 180px;
		height: 180px;
	}

	.qm-uc-desktop-workspace .qm-task-hub__metric {
		border-color: #e7eaed;
		border-radius: 8px;
		background: #ffffff;
		box-shadow: 0 4px 12px rgba(100, 116, 139, 0.06);
	}

	.qm-uc-desktop-workspace .qm-task-hub__rewards {
		gap: 7px;
		margin: 0;
	}

	.qm-uc-desktop-workspace .qm-task-hub__reward,
	.qm-uc-desktop-workspace .qm-task-hub__shortcuts > a,
	.qm-uc-desktop-workspace .qm-task-hub__calendar {
		border-color: #e7eaed;
		border-radius: 8px;
		box-shadow: none;
	}

	.qm-uc-desktop-workspace .qm-task-hub__section {
		padding: 18px;
	}
}
