/* Prettified by Source 2 Viewer 11.1.0.0 - https://valveresourceformat.github.io */

DOTAInternational2025FantasyPeriod
{
	width: 100%;
	height: 100%;
}

.MainView
{
	width: 100%;
	height: fit-children;
	flow-children: down;
	vertical-align: center;
}

#CraftingPanel,#ResultsPanel,#LockedPanel,#StarterPanel
{
	visibility: collapse;
}

#CraftingPanel
{
	width: 100%;
	height: 100%;
}

#CraftingPanel .FailureContainer
{
	height: fit-children;
	vertical-align: center;
	flow-children: down;
	margin-top: -60px;
}

#CraftingPanel .FailureContainer .LockedHeader
{
	horizontal-align: center;
	vertical-align: middle;
	font-size: 28px;
	font-family: titleFont;
	font-weight: semi-bold;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: LightestGrey;
	margin: -48px 0px 8px;
	color: gradient( linear, 0% 0%, 0% 100%, from( primaryColor1 ), to( primaryColor2 ) );
}

#CraftingPanel .FailureContainer .LockIconContainer
{
	horizontal-align: center;
	padding: 32px;
	border: 1px solid white;
	border-brush: gradient( linear, 0% 0%, 70% 70%, from( primaryColor3 ), to( primaryColor4&00 ) );
	margin: 40px;
	transform: rotateZ( 45deg );
}

#CraftingPanel .FailureContainer .LockIconContainer .LockIcon
{
	width: 24px;
	height: 24px;
	transform: rotateZ( -45deg );
}

#CraftingPanel .FailureContainer Label
{
	horizontal-align: center;
	text-transform: none;
	color: LighterGrey;
	letter-spacing: 0px;
	font-size: 18px;
}

.ShowCrafting #CraftingPanel,.ShowResults #ResultsPanel,.ShowLocked #LockedPanel,.ShowStarter #StarterPanel
{
	visibility: visible;
}

#CraftingTabletList
{
	width: 100%;
	height: fill-parent-flow( 1.0 );
	flow-children: right;
}

#CraftingTabletList DOTAInternational2025FantasyCraftTablet
{
	width: fill-parent-flow( 1.0 );
	height: 100%;
	padding: 8px 16px;
	margin: -4px;
}

#CraftingTabletList DOTAInternational2025FantasyCraftTablet#tablet_1
{
	margin-left: -16px;
}

#CraftingTabletList DOTAInternational2025FantasyCraftTablet#tablet_3
{
	margin-right: -16px;
}

.AspectRatio16x10 #CraftingTabletList DOTAInternational2025FantasyCraftTablet
{
	padding: 8px 12px;
}

.AspectRatio16x10 #CraftingTabletList DOTAInternational2025FantasyCraftTablet#tablet_1
{
	margin-left: -12px;
}

.AspectRatio16x10 #CraftingTabletList DOTAInternational2025FantasyCraftTablet#tablet_3
{
	margin-right: -12px;
}

#StarterPanel
{
	padding: 24px 0px;
	margin-bottom: 40px;
}

.CraftingFooter
{
	flow-children: down;
	horizontal-align: center;
	width: 100%;
	margin-top: 4px;
	transition-property: blur;
	transition-duration: 0.2s;
}

.CraftingFooter .CraftingTitleContainer
{
	flow-children: right;
	margin-bottom: 8px;
	horizontal-align: center;
}

.CraftingFooter .CraftingTitleContainer .CraftingTitle
{
	color: #bbbbe5;
	text-shadow: textShadowSmall;
	margin-bottom: 0px;
}

.CraftingFooter .CraftingTitleContainer .CraftPlayerName
{
	color: white;
	text-shadow: 0px 0px 12px rgba(209, 124, 255, 0.3);
}

.CraftingFooter .CraftingTitleContainer #CraftingHelpButton
{
	margin-left: 12px;
	margin-top: 4px;
}

.CraftingFooter .OperationsHolderContainer
{
	flow-children: down;
	horizontal-align: center;
	width: 100%;
}

.CraftingFooter .OperationsHolderContainer #OperationsHolder
{
	flow-children: right;
	margin-bottom: 8px;
	horizontal-align: center;
}

.CraftingFooter .OperationsHolderContainer #OperationsHolder .FantasyOperationButton
{
	margin: 0px 4px;
	max-width: 260px;
	height: 52px;
}

.CraftingFooter .OperationsHolderContainer #OperationsHolder .FantasyOperationButton.OperationUnavailable
{
	brightness: 0.4;
	saturation: 1;
	opacity: 1;
}

.CraftingFooter .OperationsHolderContainer #OperationsHolder .FantasyOperationButton Label
{
	line-height: 1.1;
	margin: 0px;
}

.CraftingFooter .CraftingStatus
{
	flow-children: right;
	vertical-align: center;
	horizontal-align: center;
	padding: 2px 0px;
}

.CraftingFooter .CraftingStatus .RerollIcon
{
	width: 32px;
	height: 32px;
	vertical-align: center;
	ui-scale: 150%;
	overflow: noclip;
}

.CraftingFooter .CraftingStatus .RerollButton
{
	margin-right: 12px;
	vertical-align: center;
	margin-top: -4px;
}

.CraftingFooter .CraftingStatus #TokensAvailableText
{
	margin-top: -4px;
}

.CraftingHelpButton
{
	flow-children: right;
	vertical-align: center;
}

.CraftingHelpButton Label
{
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #999;
}

.CraftingHelpButton:hover Label
{
	text-decoration: underline;
}

.FantasyOperation .PopupButton
{
	width: 300px;
	height: 100px;
	ui-scale: 80%;
	margin: 0px 8px;
}

.FantasyOperation .PopupButton Label
{
	text-align: center;
	letter-spacing: 2px;
}

.Header
{
	font-size: 32px;
	font-family: titleFont;
	letter-spacing: 8px;
	text-transform: uppercase;
	color: white;
	margin-bottom: 12px;
}

.BodyText
{
	font-size: 16px;
	horizontal-align: left;
	margin-left: 8px;
}

#NoOperationsText,#NoOperationsSubText
{
	color: #aca8e1c4;
	font-size: 15px;
	text-align: center;
	margin: 6px;
	visibility: collapse;
}

.CraftingStatusMessages
{
	horizontal-align: center;
	margin-top: 4px;
	width: 100%;
	border-top: 1px solid rgb(66, 62, 116);
	border-brush: gradient( linear, 0% 0%, 100% 0%, from( rgba(255, 255, 255, 0) ), color-stop( 0.5, white ), to( rgba(255, 255, 255, 0) ) );
	visibility: collapse;
}

.CraftingStatusMessages .CraftingStatusMessagesFlow
{
	horizontal-align: center;
	flow-children: right;
}

.NoRollsAvailable .CraftingStatusMessages,.FutureRollsAvailable .CraftingStatusMessages
{
	visibility: visible;
}

.NoRollsAvailable #NoOperationsText,.FutureRollsAvailable #NoOperationsSubText
{
	visibility: visible;
}

.NoRollsAvailable #OperationsHolder,.NoRollsAvailable #TokensAvailableText,.NoRollsAvailable .RerollButton
{
	visibility: collapse;
}

.PeriodResultsRow
{
	flow-children: right;
}

.PeriodResultLabel
{
	text-transform: uppercase;
	color: bluegreyTextReg;
	letter-spacing: 1px;
	font-size: 20px;
}

.PeriodResultRule
{
	vertical-align: middle;
	width: 30px;
	height: 1px;
	background-color: bluegreyTextReg;
	margin: 0 6px;
}

.PeriodResultValue
{
	color: white;
	letter-spacing: 1px;
	font-size: 20px;
	text-transform: uppercase;
}

#PeriodInfo
{
	width: fit-children;
	flow-children: down;
}

#ResultsTabletDisplay
{
	width: fill-parent-flow(1.0);
	height: 100%;
	margin-top: 4px;
}

#SelectedPeriodLockCountdown
{
	margin-top: 24px;
}

#SelectedPeriodLockCountdown .LockUpcoming
{
	color: #A3BCEF;
	text-transform: uppercase;
	letter-spacing: 1px;
}

#SelectedPeriodLockCountdown.CountdownAfterEnd .LockUpcoming
{
	visibility: collapse;
}

#SelectedPeriodLockCountdown .Locked
{
	color: #ccc;
	padding: 2px 8px;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: center;
	background-color: #79242Bff;
	visibility: collapse;
}

#SelectedPeriodLockCountdown.CountdownAfterEnd .Locked
{
	visibility: visible;
}

.ResultsTablet
{
	width: fill-parent-flow(1.0);
	height: 100%;
	flow-children: up;
	margin: 0px 12px;
}

#results_tablet_1
{
	margin-left: 0px;
}

#results_tablet_3
{
	margin-right: 0px;
}

.TabletPeriodScoreHolder
{
	width: fit-children;
	horizontal-align: center;
	flow-children: right;
}

.TabletPeriodScoreHolder Label
{
	margin-left: 2px;
	margin-right: 2px;
	font-family: titleFont;
	font-size: 24px;
	color: LightestGrey;
}

.TabletPeriodScoreHolder .ScoreLabel
{
	color: LightGrey;
}

.TabletPeriodSeriesHolder
{
	width: fit-children;
	height: fit-children;
	horizontal-align: center;
	flow-children: right;
	visibility: collapse;
	padding-left: 16px;
	margin-left: 16px;
	border-left: 1px solid rgba(255, 255, 255, 0.352);
	border-brush: gradient( linear, 0% 0%, 0% 100%, from( secondaryColor1&00 ), color-stop( 0.3, secondaryColor1 ), color-stop( 0.7, secondaryColor1 ), to( secondaryColor1&00 ) );
}

.TabletPeriodSeriesHolder Label
{
	color: LightGrey;
	vertical-align: center;
}

.TabletPeriodSeriesHolder .ResultsTeamLogo
{
	height: 32px;
	margin-left: 4px;
	margin-right: 4px;
}

.HasBestSeries .TabletPeriodSeriesHolder
{
	visibility: visible;
}

.ResultsBottom
{
	width: fit-children;
	height: fit-children;
	flow-children: left;
	horizontal-align: center;
	margin-top: -2px;
}

.PeriodPercentileReward
{
	width: fill-parent-flow( 1.0 );
	height: fit-children;
	margin: 4px;
	background-color: #0006;
	border: 1px solid transparent;
}

.Top1Percentile #Top1Reward,.Top10Percentile #Top10Reward,.Top25Percentile #Top25Reward,.Top50Percentile #Top50Reward,.Top75Percentile #Top75Reward,.Bottom25Percentile #Bottom25Reward
{
	border: 1px solid bluegreyTextReg;
}

.PeriodPercentileRewardContents
{
	flow-children: down;
	vertical-align: middle;
	horizontal-align: center;
}

.PeriodPercentileReward Label
{
	horizontal-align: center;
	text-align: center;
}

.PeriodPercentileRewardAmount
{
	color: white;
	font-size: 22px;
}

.PeriodPercentileRewardLabel
{
	color: #666;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 1px;
}

.PeriodPercentileRewardCondition
{
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #999;
	font-size: 16px;
	max-height: 21px;
	text-overflow: shrink;
}

.PeriodRewardsColumn
{
	width: fill-parent-flow( 1.0 );
	height: 100%;
	flow-children: down;
}

.PeriodRewards
{
	width: 100%;
	height: 100%;
	padding: 4px 20px;
	padding-bottom: 10px;
	flow-children: down;
	background-color: gradient( linear, 0% 40%, 0% 100%, from( rgb(12, 13, 34) ), to( rgba(0, 0, 0, 0) ) );
	border-top: 1px solid rgba(198, 152, 255, 0.249);
	border-brush: gradient( linear, 0% 0%, 100% 0%, from( rgba(255, 255, 255, 0) ), color-stop( 0.5, white ), to( rgba(255, 255, 255, 0) ) );
}

.PeriodRewardsLabel
{
	text-transform: uppercase;
	font-size: 14px;
	color: #babddb;
	width: 100%;
	text-align: center;
	letter-spacing: 2px;
	padding: 4px 4px 8px 4px;
}

.PeriodRewardsList
{
	width: 100%;
	flow-children: down;
}

.PeriodRewardsList .ScoreContainer
{
	width: 100%;
	flow-children: right;
	vertical-align: center;
	padding: 6px 0px;
	border-top: 1px solid rgba(185, 155, 255, 0.066);
}

.PeriodRewardsList .ScoreContainer Label
{
	vertical-align: center;
	width: fill-parent-flow( 1.0 );
	font-size: 20px;
}

.PeriodRewardsList .ScoreContainer .ScoreLabel
{
	vertical-align: center;
	text-align: left;
	color: LighterGrey;
	font-family: titleFont;
}

.PeriodRewardsList .ScoreContainer .Value
{
	vertical-align: center;
	text-align: right;
	font-size: 24px;
	color: white;
	height: 28px;
}

.LeaderboardContainer
{
	width: fill-parent-flow( 1.0 );
	height: 100%;
	padding: 8px;
	flow-children: down;
	background-color: gradient( linear, 0% 40%, 0% 100%, from( rgb(12, 13, 34) ), to( rgba(0, 0, 0, 0) ) );
	border-top: 1px solid rgba(198, 152, 255, 0.249);
	border-brush: gradient( linear, 0% 0%, 100% 0%, from( rgba(255, 255, 255, 0) ), color-stop( 0.5, white ), to( rgba(255, 255, 255, 0) ) );
}

#LeaderboardContainerGlobal
{
	margin: 0px 24px;
}

.LeaderList
{
	width: 100%;
	height: 100%;
	flow-children: down;
	overflow: squish scroll;
}

.LeaderListHeader
{
	width: 100%;
	margin-bottom: 8px;
}

.LeaderListHeader Label
{
	text-transform: uppercase;
	font-size: 14px;
	color: #babddb;
	letter-spacing: 2px;
}

.LeaderListHeader .TotalScore
{
	horizontal-align: right;
	text-align: right;
}

.LeaderboardRow
{
	width: 100%;
	margin-bottom: 4px;
	background-color: gradient( linear, 0% 0%, 100% 0%, from( #181456 ), color-stop( 0.5, #1814567c ), to( #18145600 ) );
	flow-children: right;
	padding-right: 4px;
}

.LeaderboardRow #LeaderListAvatar
{
	width: 24px;
	height: 24px;
	vertical-align: middle;
	background-color: rgba( 0, 0, 0, 0.5 );
	margin-right: 6px;
}

.LeaderboardRow .LeaderListName
{
	color: LightestGrey;
	vertical-align: center;
}

.LeaderboardRow .LeaderListName .PersonaName
{
	color: #bbbbbb;
}

.LeaderboardRow .LeaderListValue
{
	horizontal-align: right;
	text-align: right;
	color: LightestGrey;
	vertical-align: center;
	margin-right: 12px;
}

.ResultContentRow
{
	width: 100%;
	height: fill-parent-flow( 1.0 );
	flow-children: right;
	margin-bottom: 24px;
}

.ResultContentRow.Leaderboard
{
	height: 180px;
	margin-bottom: 0px;
}

#ProgressLevelPanel
{
	flow-children: right;
	horizontal-align: right;
	margin-right: 16px;
}

.ProgressBarContainer
{
	width: 100%;
}

#FantasyLevelProgressBar
{
	width: 100%;
	height: 12px;
	border: 1px solid hsv-transform( bluegreyTextReg, 0, 0.3, 0.3 );
	flow-children: right;
	border-radius: 6px;
}

.FantasyLevelProgressBarTick
{
	width: fill-parent-flow( 1.0 );
	height: 100%;
	border-right: 1px solid hsv-transform( bluegreyTextReg, 0, 0.3, 0.3 );
}

.FantasyLevelProgressBarTick:selected
{
	background-color: bluegreyTextReg;
}

#FantasyLevelProgressBarTick3
{
	border-right: 0px solid hsv-transform( bluegreyTextReg, 0, 0.3, 0.3 );
}

.RewardTileContainer
{
	flow-children: right;
}

.ProgressPanel
{
	flow-children: down;
	margin-top: 1px;
	margin-left: 8px;
	width: 400px;
}

.RewardTile
{
	width: fill-parent-flow( 1.0 );
	height: 48px;
}

.RewardTileValue
{
	height: 100%;
	horizontal-align: center;
	tooltip-position: top;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.RewardTileValue.ShardReward
{
	width: 24px;
	background-image: dotaPlusCurrencySmallIcon;
	background-img-opacity: 0.8;
}

.RewardTileValue
{
	width: 24px;
}

.RewardTileValue .BPReward
{
	height: 100%;
	wash-color: accentColorBright;
	width: 24px;
	background-image: bp_total_points;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.RewardTileValue .ShardRewardLabel,.RewardTileValue .BPRewardLabel
{
	vertical-align: bottom;
	horizontal-align: center;
	text-align: center;
	font-weight: bold;
	color: dotaPlusLightGold;
	font-size: 15px;
	margin-bottom: 6px;
	text-shadow: 0px 0px 4px dotaPlusGold;
}

#FantasyLevelContainer
{
	flow-children: down;
	vertical-align: middle;
	margin-right: 8px;
}

.FantasyLevelLabel
{
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 14px;
	color: bluegreyTextReg;
	text-align: center;
	horizontal-align: center;
	margin-top: 8px;
}

.FantasyLevelValue
{
	vertical-align: center;
	font-size: 28px;
	text-align: center;
	horizontal-align: center;
	background-color: #000000;
	color: white;
	padding: 2px 24px;
	border-radius: 4px;
	font-weight: bold;
	font-family: defaultFont;
	border: 1px solid bluegreyTextReg;
}

#StarterPanel .SubTitleContainer
{
	horizontal-align: center;
	width: 60%;
	flow-children: right;
	margin-bottom: 24px;
}

#StarterPanel .SubTitleContainer .Dash
{
	width: fill-parent-flow(1);
	height: 1px;
	background-color: white;
	vertical-align: center;
	background-color: gradient( linear, 0% 0%, 100% 0%, from( #dfa8f400 ), to( #dfa8f4 ) );
	opacity: 0.1;
}

#StarterPanel .SubTitleContainer .Dash.Right
{
	transform: scaleX( -1 );
}

#StarterPanel .SubTitleContainer .SubTitle
{
	margin: 0px 16px;
	color: #dfa8f4;
	text-shadow: textShadowSmall;
	margin-bottom: 4px;
}

#StarterPanel .Title
{
	horizontal-align: center;
	margin-bottom: 20px;
	width: 70%;
	text-align: center;
	font-family: titleFont;
	font-size: 44px;
	font-weight: thin;
	letter-spacing: -0.2px;
	color: white;
	text-shadow: textShadowMedium;
	text-shadow: 0px 0px 12px rgba(209, 124, 255, 0.3);
}

#StarterPanel .StartFootnote
{
	horizontal-align: center;
	margin-bottom: 16px;
	color: #BABDDB;
	text-shadow: textShadowMedium;
}

#PlayerSelectContainer
{
	width: fit-children;
	height: fit-children;
	flow-children: right;
	horizontal-align: center;
	margin-bottom: 32px;
}

#PlayerSelectContainer .FantasyPlayerTitle
{
	margin-bottom: 12px;
	margin-top: 24px;
}

#PlayerSelectContainer .PlayerChoice
{
	flow-children: down;
	margin-left: 12px;
	margin-right: 12px;
	box-shadow: 0px 4px 48px -2px rgba( 0, 0, 0, 0.7 );
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #0E0722 ), color-stop( 0.5, #200C5C ), to( #581192 ) );
}

#PlayerSelectContainer .PlayerChoice .PlayerBackgroundTexture
{
	width: 100%;
	height: 100%;
	ignore-parent-flow: true;
	background-image: url("s2r://panorama/images/events/international_2025/player_card_flag_texture_png.vtex");
	background-size: cover;
	background-position: center;
	-s2-mix-blend-mode: multiply;
}

#PlayerSelectContainer .PlayerChoice #PlayerTitle
{
	horizontal-align: center;
}

#PlayerSelectContainer .PlayerChoice #DraftPlayerButton
{
	ignore-parent-flow: true;
	vertical-align: bottom;
	horizontal-align: center;
	margin: 20px;
}

#PlayerSelectContainer .PlayerChoice .ChoiceBorder
{
	width: 100%;
	height: 100%;
	border: 1px solid rgb(255, 255, 255);
	opacity-brush: gradient( linear, 0% 0%, 0% 100%, from( white ), color-stop( 0.5, gold1 ), to( gold2 ) );
	ignore-parent-flow: true;
}

#PlayerSelectContainer .PlayerChoice.InitialRosterHasPlayer
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #240941 ), to( rgb(116, 21, 188) ) );
}

#PlayerSelectContainer .PlayerChoice.InitialRosterHasPlayer #PlayerImage
{
	wash-color: none;
	opacity: 1;
}

#PlayerSelectContainer .PlayerChoice.InitialRosterHasPlayer .ChoiceBorder
{
	animation-name: none;
	border: 1px solid rgba(255, 255, 255, 0.03);
}

#PlayerSelectContainer .PlayerImages
{
	horizontal-align: center;
}

#PlayerSelectContainer #PlayerImage
{
	width: 260px;
	height: 260px;
	horizontal-align: center;
	wash-color: rgb(181, 118, 223);
}

#PlayerSelectContainer #TeamLogo
{
	width: 88px;
	height: 88px;
	vertical-align: top;
	horizontal-align: right;
	margin-right: 12px;
	ignore-parent-flow: true;
	margin-top: 52px;
}

@keyframes 'GlowChoiceBorder'
{
	0%
	{
		border: 2px solid #9D8145;
	}
	
	100%
	{
		border: 2px solid #FFEFCA;
	}
	
}

#CreateTabletButton
{
	horizontal-align: center;
	margin-top: 24px;
	transition-property: opacity, transform;
	transition-duration: 0.3s;
	transition-timing-function: cubic-bezier(0, 0.9, 0, 0.9);
	transition-delay: 0.5s;
	opacity: 1;
	transform: none;
	visibility: visible;
	animation-name: GlowPrimaryButton;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	animation-direction: alternate-reverse;
}

#CreateTabletButton:disabled
{
	opacity: 0;
	transform: translateY( 16px );
	visibility: collapse;
}

.UpgradeFlow
{
	visibility: collapse;
}

.NoUpgradeFlow
{
	visibility: visible;
}

.UpgradeAvailable .NoUpgradeFlow
{
	visibility: collapse;
}

.UpgradeAvailable .UpgradeFlow
{
	visibility: visible;
	horizontal-align: center;
	vertical-align: center;
}

.RewardsButton
{
	margin-top: 12px;
	width: 100%;
	horizontal-align: left;
	animation-name: GlowUnclaimedRewardsBadge;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	animation-direction: alternate-reverse;
	visibility: collapse;
}

.RewardsButton.Center
{
	horizontal-align: center;
}

.HasUnclaimedRewards .RewardsButton
{
	visibility: visible;
}

.ClaimingInProgress .RewardsButton
{
	brightness: 0.4;
	saturation: 1;
	opacity: 1;
}

.Tutorial_ShowRoster #tablet_1:not(.Selected),.Tutorial_ShowRoster #tablet_2:not(.Selected),.Tutorial_ShowRoster #tablet_3:not(.Selected),.Tutorial_ViewTablet #tablet_1:not(.Selected),.Tutorial_ViewTablet #tablet_2:not(.Selected),.Tutorial_ViewTablet #tablet_3:not(.Selected),.Tutorial_Emblems #tablet_1:not(.Selected),.Tutorial_Emblems #tablet_2:not(.Selected),.Tutorial_Emblems #tablet_3:not(.Selected),.Tutorial_Operations #tablet_1,.Tutorial_Operations #tablet_2,.Tutorial_Operations #tablet_3,.Tutorial_ForgotTokens #tablet_1,.Tutorial_ForgotTokens #tablet_2,.Tutorial_ForgotTokens #tablet_3 .Tutorial_ShowRoster #tablet_1,.Tutorial_ShowRoster #tablet_2,.Tutorial_ShowRoster #tablet_3
{
	opacity: 0.06;
	saturation: 1;
	brightness: 1;
	blur: gaussian(3px);
}

.Tutorial_ShowRoster .CraftingFooter,.Tutorial_ViewTablet .CraftingFooter,.Tutorial_Emblems .CraftingFooter
{
	opacity: 0.06;
	blur: gaussian(3px);
}

.TutorialOnly
{
	visibility: collapse;
	width: 100%;
	height: 100%;
}

.TutorialButton
{
	margin-top: 16px;
	horizontal-align: left;
	animation-name: GlowPrimaryButton;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
	animation-direction: alternate-reverse;
}

.TutorialButton.Center
{
	horizontal-align: center;
}

.Show_InitialRoster,.Show_UpgradeRoster,.Show_ViewTablet,.Show_Emblems,.Show_Operations,.Show_TutorialLocked,.Show_TutorialResults,.Show_ForgotTokens,.Show_ShowRoster
{
	width: 100%;
	height: 100%;
	opacity: 0;
	transition-property: opacity, transform;
	transition-duration: 0.3s;
	transition-timing-function: cubic-bezier(0, 0.9, 0, 0.9);
	transition-delay: 0.1s;
}

.Show_ShowRoster
{
	transform: scale3d( 1.1, 1.1, 1 );
}

.Show_ViewTablet
{
	transform: translateX( 24px );
}

.Show_Emblems
{
	transform: translateX( -24px );
}

.Show_Operations
{
	transform: translateY( 24px );
}

.Tutorial_ChooseRoster .TutorialOnly,.Tutorial_ChooseRoster .Show_InitialRoster,.Tutorial_UpgradeRoster .TutorialOnly,.Tutorial_UpgradeRoster .Show_UpgradeRoster,.Tutorial_ViewTablet .TutorialOnly,.Tutorial_ViewTablet .Show_ViewTablet,.Tutorial_Emblems .TutorialOnly,.Tutorial_Emblems .Show_Emblems,.Tutorial_Operations .TutorialOnly,.Tutorial_Operations .Show_Operations,.Tutorial_Results .TutorialOnly,.Tutorial_Results .Show_TutorialResults,.Tutorial_Locked .TutorialOnly,.Tutorial_Locked .Show_TutorialLocked,.Tutorial_ForgotTokens .Show_ForgotTokens,.Tutorial_ForgotTokens .TutorialOnly,.Tutorial_ShowRoster .Show_ShowRoster,.Tutorial_ShowRoster .TutorialOnly
{
	visibility: visible;
	transition-duration: 0.15s;
	transition-timing-function: ease-in;
	transition-delay: 0s;
	opacity: 1;
	transform: none;
}

.TutorialTitle
{
	font-size: 32px;
	font-family: titleFont;
	font-weight: semi-bold;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: white;
	margin-bottom: 12px;
	horizontal-align: center;
}

.TutorialText
{
	margin: 8px 0px;
	color: #BABDDB;
	line-height: 1.2;
}

.TutorialText.Center
{
	text-align: center;
}

.TutorialListText
{
	margin-top: 8px;
	margin-bottom: 8px;
	color: #BABDDB;
	text-shadow: 0px 2px 12px rgba(0, 0, 0, 0.6);
}

.TutorialListText b
{
	color: whitesmoke;
	font-weight: semi-bold;
}

.InitialRosterMid
{
	height: fit-children;
	width: 75%;
	flow-children: down;
	horizontal-align: center;
	vertical-align: center;
}

.ViewTabletLeft
{
	height: fit-children;
	width: 30%;
	horizontal-align: left;
	flow-children: down;
	padding: 24px;
	margin-top: 24px;
}

.EmblemRight
{
	height: fit-children;
	width: 30%;
	horizontal-align: right;
	flow-children: down;
	padding: 24px;
	margin-top: 24px;
	margin-right: 24px;
}

.OperationsMid,.UpgradeMid
{
	height: fit-children;
	width: 40%;
	vertical-align: bottom;
	horizontal-align: center;
	margin-bottom: 240px;
	flow-children: down;
}

.OperationsMid .TutorialText,.UpgradeMid .TutorialText
{
	text-align: center;
}

.OperationsMid .TutorialButton,.UpgradeMid .TutorialButton
{
	horizontal-align: center;
}

.ShowRosterMid
{
	height: fit-children;
	width: 60%;
	vertical-align: center;
	horizontal-align: center;
	margin-bottom: 180px;
	flow-children: down;
	padding: 48px 140px;
	background-color: gradient( linear, 0% 0%, 100% 0%, from( #0000 ), color-stop( 0.2, rgba(8, 17, 15, 0.9) ), color-stop( 0.8, rgba(8, 17, 15, 0.9) ), to( #0000 ) );
	border-top: 1px solid white;
	border-bottom: 1px solid white;
	border-brush: gradient( linear, 0% 0%, 100% 0%, from( #dbc49100 ), color-stop( 0.3, #dbc491c7 ), color-stop( 0.5, #ffe9bb ), color-stop( 0.7, #dbc491c7 ), to( #dbc49100 ) );
}

.ShowRosterMid .TitleTutorialInitial
{
	text-align: center;
	horizontal-align: center;
}

.ShowRosterMid .TutorialText
{
	text-align: center;
}

.ShowRosterMid .TutorialButton
{
	horizontal-align: center;
}

.TitleTutorialInitial
{
	color: whitesmoke;
	text-shadow: 0px 2px 12px rgba(0, 0, 0, 0.6);
}

.TutorialText
{
	margin-bottom: 16px;
	text-shadow: 0px 2px 12px rgba(0, 0, 0, 0.6);
}

.Show_TutorialResults
{
	background-color: gradient( linear, 0% 0%, 0% 100%, from( #0000 ), color-stop( 0.01, #000a ), color-stop( 0.6, #000a), to( #0000 ) );
}

.ResultsMid
{
	height: fit-children;
	width: 60%;
	flow-children: down;
	horizontal-align: center;
	vertical-align: center;
}

.Tutorial_Locked #LockedPanel
{
	visibility: collapse;
}

.LockedMid,.ResultsMid
{
	height: fit-children;
	width: 40%;
	flow-children: down;
	horizontal-align: center;
	vertical-align: center;
}

.TutorialStat,.TutorialQuality,.TutorialTrait
{
	visibility: collapse;
}

.TitleTutorial_Stat .TutorialStat,.TitleTutorial_Quality .TutorialStat,.TitleTutorial_Trait .TutorialStat,.TitleTutorial_Quality .TutorialQuality,.TitleTutorial_Trait .TutorialQuality,.TitleTutorial_Trait .TutorialTrait,.TitleTutorial_Stat .EmblemTutorialInitial,.TitleTutorial_Quality .EmblemTutorialInitial,.TitleTutorial_Trait .EmblemTutorialInitial
{
	visibility: visible;
	color: #ffffff22;
}

.TitleTutorial_Stat .TutorialStat b,.TitleTutorial_Quality .TutorialStat b,.TitleTutorial_Trait .TutorialStat b,.TitleTutorial_Quality .TutorialQuality b,.TitleTutorial_Trait .TutorialQuality b,.TitleTutorial_Trait .TutorialTrait b,.TitleTutorial_Stat .EmblemTutorialInitial b,.TitleTutorial_Quality .EmblemTutorialInitial b,.TitleTutorial_Trait .EmblemTutorialInitial b
{
	color: #ffffff22;
}

.TitleTutorial_Stat .TutorialStat,.TitleTutorial_Quality .TutorialQuality,.TitleTutorial_Trait .TutorialTrait
{
	color: LighterGrey;
}

.TitleTutorial_Stat .TutorialStat b,.TitleTutorial_Quality .TutorialQuality b,.TitleTutorial_Trait .TutorialTrait b
{
	font-weight: semi-bold;
	color: whitesmoke;
}

.TutorialViewTitle
{
	visibility: collapse;
}

.TitleTutorial_Details .TutorialViewTitle
{
	visibility: visible;
}

.PerformingOperation .ButtonPrimary
{
	opacity: 0.2;
}

.LoadingSpinnerPanel
{
	horizontal-align: center;
	vertical-align: center;
}