/* ===== TRICK OR TREATING: PAGE STYLES ===== */
/* DOCS: AI Resources/Core Resources/Code Documentation/festival/festival_fall/trick_or_treating/css/page.md */

/* ----- THE TOOL CARD: ONE HEIGHT FOR EVERY TAB ----- */
#Div_Tabs_Trick_Or_Treating { --Tab_Panel_Height: 440px; --House_Head_Height: 64px; --House_Foot_Height: 86px; }
.Trick_Or_Treating_Placeholder { display: flex; align-items: center; justify-content: center; height: var(--Tab_Panel_Height); box-sizing: border-box; padding: 0 20px; text-align: center; }
.Trick_Or_Treating_Loading .House_Image, .Trick_Or_Treating_Loading .House_Facts, .Trick_Or_Treating_Loading .House_None, .Trick_Or_Treating_Loading .Door_Answer, .Trick_Or_Treating_Loading .Basket_Panel, .Trick_Or_Treating_Loading .Filtered_Panel { opacity: 0.55; pointer-events: none; transition: opacity 0.15s ease; }

/* ----- THE VISIT TAB: THE IMAGE BOX AT THE AVATAR'S WIDTH, THE FACTS AND NAVIGATION BOXES SHARING THE REST, EACH THE PANEL'S HEIGHT ----- */
.House_Visit { display: grid; grid-template-columns: 344px repeat(2, minmax(0, 1fr)); gap: 20px; height: var(--Tab_Panel_Height); text-align: left; }
.House_Host, .House_Panel { display: contents; }

/* ----- THE IMAGE BOX: THE GREETING AT THE HEAD HEIGHT, THE WHOLE AVATAR, THE HINT AND ACTION AT THE FOOT HEIGHT ----- */
.House_Image { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.House_Avatar { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; min-height: 0; }
.House_Avatar img { width: 280px; height: 280px; }
.House_Action_Slot { display: flex; align-items: center; justify-content: center; height: 40px; }
.House_Login_Button { width: 260px; }
.House_None { grid-column: 1 / 3; display: flex; align-items: center; justify-content: center; padding: 0 20px; text-align: center; }
.House_Action_Hint { white-space: nowrap; font-size: var(--Font_Text_Small); color: var(--Color_Text_Soft); text-align: center; }

/* ----- THE FACTS AND NAVIGATION BOXES: ONE HEAD HEIGHT, ONE FOOT HEIGHT, STRIPS SPLIT BY THE 2PX RULE ----- */
.House_Facts, .House_Nav { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.House_Box_Head { display: flex; align-items: center; justify-content: center; flex: none; height: var(--House_Head_Height); padding: 0 12px; box-sizing: border-box; border-bottom: 2px solid var(--Color_Secondary_Deep); }
.House_Greeting { position: relative; padding: 0 44px; }
.House_Greeting_Text { font-family: var(--Font_Header); font-weight: bold; font-size: var(--Font_Text_Mid); letter-spacing: var(--Font_Header_Spacing); line-height: 1.2; color: var(--Color_Main); text-align: center; text-wrap: balance; }
.House_Settings_Cog { position: absolute; right: 4px; }
.House_Name_Plate { flex-direction: column; gap: 4px; }
.House_Name, .House_Title, .House_Box_Title { min-width: 0; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.House_Title { min-height: 1lh; }
.House_Box_Title { font-family: var(--Font_Header); font-weight: bold; font-size: var(--Font_Text_Large); color: var(--Color_Main); }
.House_Fact_Table { flex: 1 1 auto; }
.House_Fact_Table td:first-child { width: 128px; }
.House_Copy_Button { padding: 0; border: 0; background: none; font: inherit; color: inherit; }
.House_Door_Strip, .House_Action { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; flex: none; height: var(--House_Foot_Height); padding: 0 12px; box-sizing: border-box; border-top: 2px solid var(--Color_Secondary_Deep); }
.House_Door_Line { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ----- NAVIGATION: THE TITLE AND OPEN COUNT BLOCK AT THE HEAD HEIGHT, FOUR FULL-WIDTH STRIPS SHARING WHAT IS LEFT, THEN FIND A PLAYER AT THE FOOT HEIGHT ----- */
.House_Nav_Block { display: flex; flex-direction: column; justify-content: center; flex: none; padding: 0 14px; box-sizing: border-box; }
.House_Nav_Top { height: var(--House_Head_Height); align-items: center; gap: 4px; border-bottom: 2px solid var(--Color_Secondary_Deep); }
.House_Nav_Visit { height: var(--House_Foot_Height); border-top: 2px solid var(--Color_Secondary_Deep); }
.House_Nav_Host, .House_Nav_Strips { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.House_Nav_Strip, .Filter_Strip
	{
		flex: 1 1 0;
		display: flex;
		align-items: center;
		gap: 10px;
		width: 100%;
		min-height: 0;
		padding: 0 12px;
		box-sizing: border-box;
		border: 0;
		background: none;
		font-family: var(--Font_Header);
		font-weight: bold;
		font-size: var(--Font_Text_Mid);
		letter-spacing: var(--Font_Header_Spacing);
		color: var(--Color_Link);
		text-align: left;
		cursor: pointer;
		transition: background-color 0.12s ease, color 0.12s ease;
	}
.House_Nav_Strip + .House_Nav_Strip, .Filter_Strip + .Filter_Strip { border-top: 2px solid var(--Color_Secondary_Deep); }
.House_Nav_Strip_Next { flex-direction: row-reverse; text-align: right; }
.House_Nav_Strip:disabled { color: var(--Color_Text_Soft); cursor: default; opacity: 0.6; }
.House_Nav_Strip_Here { color: var(--Color_Text); cursor: default; }
.House_Nav_Strip:focus-visible, .Filter_Strip:focus-visible { outline: 2px solid var(--Color_Main); outline-offset: -2px; }
.House_Nav_Chevron { display: inline-flex; flex: none; width: 24px; line-height: 0; }
.House_Nav_Chevron svg { width: 24px; height: 24px; fill: currentColor; }
.House_Nav_Chevron_Previous svg { transform: rotate(90deg); }
.House_Nav_Chevron_Next svg { transform: rotate(-90deg); }
.House_Nav_Art { display: flex; align-items: center; justify-content: center; flex: none; width: 48px; height: 48px; box-sizing: border-box; overflow: hidden; border: 2px solid var(--Color_Border); border-radius: 4px; }
.House_Nav_Art:empty { visibility: hidden; }
.House_Nav_Glyph { display: inline-flex; line-height: 0; color: var(--Color_Main); }
.House_Nav_Glyph svg { width: 28px; height: 28px; fill: currentColor; }
.House_Nav_Label { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ----- THE CANDY BASKET TAB: UNCLAIMED TREATS ON THE IMAGE BOX'S COLUMN, YOUR CANDY ACROSS THE OTHER TWO, THE VISIT TAB'S HEAD AND FOOT HEIGHTS ----- */
.Basket_Panel { display: grid; grid-template-columns: 344px minmax(0, 1fr); gap: 20px; height: var(--Tab_Panel_Height); text-align: left; }
.Basket_Treats, .Basket_Candy { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.Basket_Treats_Scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.Basket_Treats_Table tbody tr { height: 36px; }
.Basket_Treats_Left_Column { width: 130px; }
.Basket_Treat_From { display: flex; align-items: center; }
.Basket_Treat_From > a { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.Basket_Treat_From > img { flex: none; margin-left: auto; }
.Basket_Foot { display: flex; align-items: center; justify-content: space-around; gap: 12px; flex: none; height: var(--House_Foot_Height); padding: 0 12px; box-sizing: border-box; border-top: 2px solid var(--Color_Secondary_Deep); }
.Basket_Candy .Basket_Foot { justify-content: space-between; }
.Basket_Candy_Grid { flex: 1 1 auto; display: grid; grid-template-columns: repeat(7, 84px); grid-auto-rows: 84px; gap: 10px; align-content: center; justify-content: center; }
.Basket_Candy_Tile_None .Door_Answer_Tile_Count { color: var(--Color_Text_Soft); }
.Basket_Handful { display: flex; align-items: center; gap: 10px; min-width: 0; }
.Basket_Handful img { flex: none; }
.Basket_Handful_Text { min-width: 0; }
.Basket_Foot_Buttons { display: flex; flex: none; gap: 10px; }

/* ----- SWAP MODE: THE TILES YOU CAN PICK LIT, THE REST FADED, THE GIVER TINTED ----- */
.Basket_Swapping .Basket_Candy_Tile:not(.Basket_Candy_Tile_Pickable):not(.Basket_Candy_Tile_Picked) { opacity: 0.35; }
.Basket_Candy_Tile_Pickable, .Basket_Candy_Tile_Picked { border-color: var(--Color_Main); }
.Basket_Candy_Tile_Picked { background: hsl(from var(--Color_Main) h s l / 0.18); box-shadow: inset 0 0 0 2px var(--Color_Main); }

/* ----- THE SWAP CONFIRM: CONSUME AND RECEIVE, EACH LABEL RIGHT OF ITS ROW'S ART, THE BOX WIDE ENOUGH FOR THE LONGEST NAMES ----- */
.Basket_Swap_Box { width: 500px; }
.Basket_Swap_Confirm { display: inline-grid; grid-template-columns: auto auto; align-items: center; gap: 10px; text-align: left; }
.Basket_Swap_Confirm > :nth-child(odd) { justify-self: end; }

/* ----- THE ACHIEVEMENTS AND LOG TABS: THE FILTER BOX ON THE IMAGE BOX'S COLUMN, ITS STRIPS SHARING THE HEIGHT UNDER THE HEAD; ONE SCROLLING LIST ACROSS THE OTHER TWO ----- */
.Filtered_Panel { display: grid; grid-template-columns: 344px minmax(0, 1fr); gap: 20px; height: var(--Tab_Panel_Height); text-align: left; }
.Filter_Box, .Filtered_List { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.Filter_Strips { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
.Filter_Strip { flex-direction: column; align-items: stretch; justify-content: center; gap: 8px; padding: 0 20px; }
.Filter_Strip_Line { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.Filter_Strip_Hint { font-family: var(--Font_Body); font-weight: normal; font-size: var(--Font_Text_Small); letter-spacing: normal; }
.Filter_Strip[aria-pressed="true"] { background: hsl(from var(--Color_Main) h s l / 0.18); box-shadow: inset 4px 0 0 var(--Color_Main); color: var(--Color_Main); cursor: default; }
.Filtered_Scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; }

/* ----- THE ACHIEVEMENTS LIST: TWO-LINE ROWS UNDER EACH TRACK'S HEADING; THE BAR 2PX-BORDERED, FILLED IN THE MAIN COLOUR, THE POSITIVE ONE WHEN UNLOCKED ----- */
.Achievements_Name_Column { width: 31%; }
.Achievements_Progress_Column { width: 18%; }
.Achievements_Panel_Guest .Achievements_Name_Column { width: 50%; }
.Achievements_Table tbody tr { height: 47px; }
.Achievements_Table tbody td { padding-top: 3px; padding-bottom: 3px; }
.Achievements_Table tbody td:last-child { padding-right: 20px; }
.Achievements_Table tbody tr.Achievements_Track_Row { height: 30px; }
.Achievements_Table tbody tr.Achievements_Row_Divided td { border-bottom: 1px solid var(--Color_Secondary_Raised); }
.Achievements_Table tbody tr.Achievements_Row_Foot td { border-bottom: none; }
.Achievements_Panel:not(.Achievements_Panel_Guest) .Achievements_Table th:nth-child(2) { text-align: center; }
.Achievements_Track_Row td { background: hsl(from var(--Color_Main) h s l / 0.1); font-family: var(--Font_Header); font-weight: bold; letter-spacing: var(--Font_Header_Spacing); color: var(--Color_Main); }
.Achievements_Lines { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.Achievements_Lines > * { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.Achievement_Bar { display: block; flex: none; height: 8px; overflow: hidden; border: 2px solid var(--Color_Border); border-radius: 4px; background: var(--Color_Div_1); }
.Achievement_Bar_Fill { display: block; height: 100%; border-radius: 2px; background: var(--Color_Main); }
.Achievements_Row_Unlocked .Achievement_Bar_Fill, .Achievement_Unlock_Progress_Reached .Achievement_Bar_Fill { background: var(--Color_Positive); }
.Achievement_Progress_Line { text-align: center; }
.Achievement_Unlocked_Line { display: inline-grid; justify-items: center; }
.Achievement_Unlocked_Line:focus { outline: none; }
.Achievement_Unlocked_Line > span { grid-area: 1 / 1; }
.Achievement_Unlocked_Count, .Achievement_Unlocked_Line:hover > .Achievement_Unlocked_Day { visibility: hidden; }
.Achievement_Unlocked_Line:hover > .Achievement_Unlocked_Count { visibility: visible; }
.Achievements_Reward { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; }
.Achievements_Reward > .Achievements_Lines { position: relative; }
.Achievements_Background_Label:focus, .Achievements_Perk_Label:focus { outline: none; }
.Achievements_Reward_Hint { display: none; }
.Achievements_Reward_Art { flex: none; line-height: 0; }
.Achievements_Reward_Art img { width: 40px; height: 40px; border-radius: 4px; }
.Achievements_Reward_Art img.Achievements_Reward_Star { width: 34px; height: 34px; margin: 3px; }

/* ----- THE LOG LIST: A PAGE OF ONE-LINE ROWS AT ONE HEIGHT, BLANK ROWS AFTER THE LAST, THE PAGE TURNER FILLING THE REST OF THE BOX ----- */
.Log_Region { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
.Log_Table { flex: none; }
.Log_Table thead th { height: 30px; box-sizing: border-box; background: var(--Color_Div_3); }
.Log_Table tbody tr { height: 36px; }
.Log_Table_Empty { position: relative; }
.Log_Table_Empty td { border-bottom-color: transparent; }
.Log_Empty_Note { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 0 20px; text-align: center; pointer-events: none; }
.Log_Region > .Pager { flex: 1 1 auto; margin: 0; padding: 0 12px; border-top: 2px solid var(--Color_Secondary_Deep); }
.Log_Date_Column { width: 130px; }
.Log_Player_Column { width: 28%; }
.Log_Role_Column { width: 80px; }

/* ----- THE ANSWER POPUP AND THE ITEM PICKER ABOVE IT: ONE BODY HEIGHT ----- */
.Door_Popup_Body { height: 392px; box-sizing: border-box; }

/* ----- THE ANSWER POPUP: SELECT A TREAT | THE VISITOR'S AVATAR | VISITORS IN LINE, THE LINE UNDER ALL THREE ----- */
.Door_Answer { height: 100%; }
.Door_Answer_Visitor { flex: 1 1 auto; display: grid; grid-template-columns: minmax(0, 1fr) 300px minmax(0, 1fr); align-content: center; align-items: center; column-gap: 20px; row-gap: 10px; text-align: center; }
.Door_Answer_Avatar img { width: 300px; height: 300px; }
.Door_Answer_Line { grid-column: 1 / -1; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.Door_Answer_Side { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.Door_Answer_Grid { display: grid; grid-template-columns: repeat(2, 84px); grid-auto-rows: 84px; gap: 10px; }
.Door_Answer_Tile { position: relative; display: flex; align-items: center; justify-content: center; width: 84px; height: 84px; padding: 0; box-sizing: border-box; overflow: hidden; border: 2px solid var(--Color_Border); border-radius: 4px; background: var(--Color_Div_1); font: inherit; color: inherit; }
button.Door_Answer_Tile { cursor: pointer; transition: border-color 0.12s ease; }
button.Door_Answer_Tile:disabled { cursor: default; opacity: 0.45; filter: grayscale(1); }
.Door_Answer_Tile_Empty { border-style: dashed; background: transparent; }
.Door_Answer_Tile_Count { position: absolute; right: 5px; bottom: 3px; font-family: var(--Font_Header); font-weight: bold; font-size: var(--Font_Text_Small); line-height: 1; color: var(--Color_Positive); text-shadow: 0 0 3px var(--Color_Div_1), 0 0 3px var(--Color_Div_1); }
.Door_Answer_Tile_Infinity { display: inline-flex; }
.Door_Answer_Tile_Infinity svg { width: 20px; height: 20px; margin: -4px -2px; fill: currentColor; filter: drop-shadow(0 0 2px var(--Color_Div_1)); }

/* ----- THE GOLD GLOWING TILE: THE CANDY TILE WITH GENEROUS HOST (PULSING, x2) ----- */
.Door_Answer_Tile_Boosted { border-color: var(--Color_Accent_Strong); background: radial-gradient(circle, hsl(from var(--Color_Accent) h s l / 0.8), var(--Color_Div_1) 72%); box-shadow: 0 0 0 2px var(--Color_Accent), 0 0 16px 2px var(--Color_Accent); }
.Door_Answer_Tile_Boosted { animation: Door_Boost_Pulse 1.6s ease-in-out infinite; }
.Door_Answer_Tile_Badge { position: absolute; top: 0; left: 0; padding: 3px 5px; border-radius: 0 0 4px 0; background: var(--Color_Accent_Strong); color: var(--Color_On_Accent); font-family: var(--Font_Header); font-weight: bold; font-size: var(--Font_Text_Small); line-height: 1; }
@keyframes Door_Boost_Pulse { 50% { box-shadow: 0 0 0 2px var(--Color_Accent), 0 0 24px 6px var(--Color_Accent); } }
@media (prefers-reduced-motion: reduce) { .Door_Answer_Tile_Boosted { animation: none; } }

/* ----- THE TREAT REVEAL: THE ANSWER POPUP'S BOX; YOUR TREAT LARGE WITH ITS NAME, PERK PIECES GOLD UNDER IT, MIRRORING TREATS LEFT AND CLAIM NEXT ----- */
.Basket_Reveal_Hero { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 100%; height: 178px; }
.Basket_Reveal_Hero_Tile { width: 120px; height: 120px; flex: none; }
.Basket_Reveal_Hero_Tile img { width: 100px; height: 100px; }
.Basket_Reveal_Name { display: -webkit-box; max-width: 100%; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; font-size: var(--Font_Text_Small); }
.Basket_Reveal_Foot { display: flex; align-items: center; justify-content: center; gap: 10px; height: 40px; }
.Basket_Bonus_Tile { width: 40px; height: 40px; }
.Basket_Bonus_Tile img { width: 32px; height: 32px; }
.Basket_Bonus_Tile .Door_Answer_Tile_Badge { padding: 2px 3px; }

/* ----- THE ACHIEVEMENT UNLOCKED WINDOW: THE NOTICE BOX UNDER A GOLD HEAD; THE GOLD-BORDERED ART TILE, THE NAME OVER ITS REQUIREMENT AND ITS BAR, THEN THE KIND, THE REWARD AND THE HINT ----- */
.Achievement_Unlock_Box { display: flex; flex-direction: column; width: 470px; max-height: calc(100vh / var(--Zoom, 1) - var(--Popup_Anchor_Top) - 16px); max-height: calc(100dvh / var(--Zoom, 1) - var(--Popup_Anchor_Top) - 16px); }
.Achievement_Unlock_Box > .Error_Box_Head, .Achievement_Unlock_Box > .Error_Box_Foot, .Achievement_Unlock_Body > * { flex: none; }
.Achievement_Unlock_Box .Error_Box_Head { background: linear-gradient(180deg, hsl(from var(--Color_Accent) h s calc(l + 6)) 0%, var(--Color_Accent) 55%, hsl(from var(--Color_Accent) h s calc(l - 10)) 100%); border-bottom-color: var(--Color_Accent_Strong); color: var(--Color_Chrome); }
.Achievement_Unlock_Box .Error_Box_Head .Close_X_White { --X_Color: var(--Color_Chrome); --X_Hover: var(--Color_Negative); border-radius: 4px; transition: transform 0.05s ease, background-color 0.1s ease; }
.Achievement_Unlock_Box .Error_Box_Head .Close_X_White:hover { background: var(--Color_Surface); }
.Achievement_Unlock_Body { display: flex; flex-direction: column; align-items: center; gap: 10px; min-height: 0; overflow-y: auto; font-weight: normal; color: var(--Color_Text); }
.Achievement_Unlock_Lines { display: flex; flex-direction: column; gap: 4px; max-width: 100%; }
.Achievement_Unlock_Name { font-size: var(--Font_Header_Mid); }
.Achievement_Unlock_Greeting { font-family: var(--Font_Header); letter-spacing: var(--Font_Header_Spacing); }
.Achievement_Unlock_Quote_Mark { font-family: var(--Font_Header); font-weight: bold; font-size: 92px; line-height: 1; color: var(--Color_Accent_Strong); translate: 0 0.24em; }
.Achievement_Unlock_Tile { border-color: var(--Color_Accent_Strong); }
.Achievement_Unlock_Progress { align-self: center; width: 240px; max-width: 100%; margin-top: 4px; }
.Achievement_Unlock_Count, .Achievement_Unlock_Goal { display: inline-grid; }
.Achievement_Unlock_Count { justify-items: end; }
.Achievement_Unlock_Count::before, .Achievement_Unlock_Count > span, .Achievement_Unlock_Goal::before, .Achievement_Unlock_Goal > span { grid-area: 1 / 1; }
.Achievement_Unlock_Count::before, .Achievement_Unlock_Goal::before { content: attr(data-goal); font-weight: bold; visibility: hidden; }

/* ----- THE ACHIEVEMENT UNLOCKED WINDOW ON A SHORT SCREEN: WIDER, THE TILE BESIDE THE LINES; ONE ROW WHERE IT IS WIDE TOO ----- */
@media (max-height: 660px)
	{
		.Achievement_Unlock_Box { width: 560px; }
		.Achievement_Unlock_Body { display: grid; grid-template-columns: 84px minmax(0, 1fr); align-items: center; gap: 6px 16px; padding-top: 12px; line-height: 1.3; text-align: left; }
		.Achievement_Unlock_Tile { grid-row: 1 / 3; }
		.Achievement_Unlock_Lines { gap: 2px; }
		.Achievement_Unlock_Progress { align-self: flex-start; margin-top: 2px; }
	}
@media (max-height: 660px) and (min-width: 640px)
	{
		.Achievement_Unlock_Box { width: 830px; }
		.Achievement_Unlock_Body { grid-template-columns: 84px auto minmax(0, 1fr); gap: 0 20px; }
		.Achievement_Unlock_Tile { grid-row: auto; }
	}

/* ----- THE CLAIM ALL SUMMARY: THE ITEM PICKER'S BOX; ONE ROW PER PIECE, A PERK PIECE'S BONUS MARK IN GOLD ----- */
.Basket_Summary_From_Column { width: 200px; }
.Basket_Bonus_Label { color: var(--Color_Accent_Strong); }
.Basket_Summary_Counts { display: flex; }

/* ----- THE ITEM PICKER: EVERY ITEM IN ONE SCROLLING LIST UNDER A STICKY HEAD, THE SEARCH AND GIFT ITEM IN THE BOX'S FOOT ----- */
.Door_Gift_Box { display: flex; flex-direction: column; height: 100%; box-sizing: border-box; overflow: hidden; }
.Door_Gift_Scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.Door_Gift_Table thead th, .Basket_Treats_Table thead th, .Achievements_Table thead th { position: sticky; top: 0; z-index: 1; height: 30px; box-sizing: border-box; background: var(--Color_Div_3); }
.Basket_Treats_Table thead th { height: 34px; }
.Door_Gift_Scroll > .os-scrollbar.os-scrollbar-vertical, .Filtered_Scroll > .os-scrollbar.os-scrollbar-vertical { top: 30px; }
.Basket_Treats_Scroll > .os-scrollbar.os-scrollbar-vertical { top: 34px; }
.Door_Gift_Table th:nth-child(2) { text-align: center; }
.Door_Gift_Table tbody tr { height: 36px; }
.Door_Empty { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; padding: 0 20px; text-align: center; }
.Door_Gift_No_Match { padding: 30px 20px; }
.Door_Gift_Name { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.Door_Gift_Stack_Column { width: 120px; }
.Door_Gift_Item { display: inline-flex; align-items: center; gap: 10px; min-width: 0; max-width: 100%; vertical-align: middle; }
.Door_Gift_Item img { flex: none; }
.Door_Gift_Foot { display: flex; flex: none; align-items: center; justify-content: space-between; gap: 20px; height: 69px; box-sizing: border-box; padding: 13px 12px 14px; border-top: 2px solid var(--Color_Secondary_Deep); }
.Door_Gift_Search { flex: 0 1 50%; }
.Door_Gift_Search .Field_Input { width: 100%; box-sizing: border-box; }

/* ----- HOUSE SETTINGS: THE 200PX PREVIEW BESIDE THE TWO CHOICES ----- */
.House_Settings_Grid { display: grid; grid-template-columns: 244px minmax(0, 1fr); }
.House_Settings_Preview { display: flex; align-items: center; justify-content: center; }
.House_Settings_Preview img { width: 200px; height: 200px; }

/* ----- HOVER: POINTER DEVICES ONLY ----- */
@media (hover: hover)
	{
		button.House_Nav_Strip:not(:disabled):hover, .Filter_Strip:not([aria-pressed="true"]):hover { background: hsl(from var(--Color_Main) h s l / 0.1); color: var(--Color_Main); }
		button.Door_Answer_Tile:not(:disabled):not(.Basket_Candy_Tile):hover, .Basket_Candy_Tile_Pickable:hover { border-color: var(--Color_Main); }
	}

/* ----- TOUCH: A TAPPED UNLOCKED LINE SHOWS ITS COUNT; A TAPPED "House Background*" OR PERK LABEL ITS LINE ACROSS THE REWARD BESIDE THE ART; THE ACHIEVEMENT UNLOCKED WINDOW UNDER CORE'S PHONE ANCHOR ----- */
@media (hover: none) and (pointer: coarse)
	{
		.Achievement_Unlock_Box { max-height: calc(var(--Device_Height, 100dvh) * 0.8 - 16px); }
		.Achievement_Unlocked_Line:focus > .Achievement_Unlocked_Day { visibility: hidden; }
		.Achievement_Unlocked_Line:focus > .Achievement_Unlocked_Count { visibility: visible; }
		.Achievements_Reward > .Achievements_Lines { flex: 1 1 auto; }
		.Achievements_Reward .Achievements_Lines:focus-within > :not(.Achievements_Reward_Hint) { opacity: 0; }
		.Achievements_Reward .Achievements_Lines:focus-within > .Achievements_Reward_Hint { display: -webkit-box; position: absolute; inset: 0; overflow: hidden; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
	}
