/*
App Name:			Battle of Triads
Description:			Portrait card battle game.
Version: 				1.39.4
Icon Image:			fa7pr fa7p-cards-blank
Icon Color:			#ffffff
Icon BG Color: 	#1d2122
Window Title:		Battle of Triads
Resizable:			true
Maximizable:		true
Fit To Content:		false
*/

@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;700&family=Cinzel:wght@700&family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=swap');
#app-battleoftriads-window{width:min(960px,calc(100vw - 40px));height:min(804px,calc(var(--app-height,100dvh) - 100px));min-width:0;min-height:0}
#app-battleoftriads-window > .window-body{height:calc(100% - var(--titlebar-height));padding:0;overflow:hidden;background-color:#1d2122;line-height:0}
#app-battleoftriads-window .triads-frame{width:100%;height:100%;min-width:0;min-height:0;position:relative;background-color:#1d2122}
#app-battleoftriads-window :where(.triads-frame *){color:inherit;font-size:revert;font-weight:revert;font-style:revert;line-height:1}
/*--------------------------------------------------------------------------------
	BASE
	Font, reset, app frame and design tokens.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame *{box-sizing:border-box;font-family:'Cinzel',Georgia,serif;line-height:1}#app-battleoftriads-window .triads-frame #app{
	/* image */
	--imageBackdeck:url("https://azythegreat.com/wp-content/uploads/2026/09/backdeck.png");

	/* grayscale — name is "Gray" + the hex byte of that shade, so the name tells you the value */
	--colorBlack:#000000;--colorWhite:#ffffff;
	--colorGray11:#111111;--colorGray11a000:rgba(17,17,17,0);--colorGray11a100:rgba(17,17,17,1);--colorGray15:#151515;--colorGray15a050:rgba(21,21,21,.5);--colorGray15a100:rgba(21,21,21,1);--colorGray18:#181818;--colorGray18a000:rgba(24,24,24,0);--colorGray18a035:rgba(24,24,24,.35);--colorGray18a100:rgba(24,24,24,1);--colorGray22:#222222;--colorGray22a000:rgba(34,34,34,0);--colorGray22a100:rgba(34,34,34,1);--colorGray25:#252424;--colorGray2D:#2d2d2d;--colorGray35:#353535;
	--colorGray44:#444444;--colorGray99:#999999;
	--colorGrayF2:#f2f2f2;

	/* neutral hues */
	--colorSlate1D2122:#1d2122;--colorSlate1D2122a000:rgba(29,33,34,0);--colorSlate1D2122a050:rgba(29,33,34,.5);--colorSlate1D2122a100:rgba(29,33,34,1);

	/* accent hues */
	--colorCyan:#66d7ff;--colorPink:#ff7a9e;
	--colorGreen:#3fb950;--colorGreenDark:#34a344;--colorGreen008:#008000;--colorRed:#ff0000;
	/* card ownership border, re-tinted per AI skill by gameColorAI */
	--colorOwnerPlayer:var(--colorCyan);--colorOwnerAI:var(--colorPink);

	/* dice glow */
	--colorBlue040:rgba(154,190,216,.4);--colorRed040:rgba(237,85,100,.4);

	/* dice-face gradient tints */
	--colorGrayE6:#e6e6e6;--colorGrayB8:#b8b8b8;

	/* translucent (base color + alpha baked into the name as alpha*100, zero-padded) */
	--colorBlack028:rgba(0,0,0,.28);--colorBlack045:rgba(0,0,0,.45);
	--colorBlack055:rgba(0,0,0,.55);--colorBlack090:rgba(0,0,0,.9);
	--colorWhite003:rgba(255,255,255,.03);
	--colorWhite090:rgba(255,255,255,.9);
	--colorGray11088:rgba(17,17,17,.88);--colorGray11090:rgba(17,17,17,.9);
	--colorGray50028:rgba(80,80,80,.28);

	/* sizes */
	--sizeDice:80px;--sizeDiceHalf:40px;
	--sizeBar:clamp(28px,calc(var(--triads-height,760px) * .05),52px);--sizeFooterBar:clamp(28px,calc(var(--triads-height,760px) * .05),52px);--sizeDeckPad:20px;
}#app-battleoftriads-window .triads-frame #app{width:100%;height:100%;min-width:0;min-height:0;margin:0 auto;padding:0;overflow:hidden;background-color:var(--colorSlate1D2122);color:var(--colorGrayF2);overscroll-behavior:none;position:relative}#app-battleoftriads-window .triads-frame #app.stateGameActive{display:grid;grid-template-columns:100%;grid-template-rows:20% 55% 25%;align-content:stretch;gap:0;align-items:stretch;justify-items:center}#app-battleoftriads-window .triads-frame #app.stateGameIntro>.gameDeckArea{visibility:hidden}#app-battleoftriads-window .triads-frame button{font:inherit}#app-battleoftriads-window .triads-frame .stateHidden{display:none!important}/*--------------------------------------------------------------------------------
	PAGES
	Full-screen manual page.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame #pageManual{display:none;position:absolute;top:var(--sizeBar);right:0;bottom:0;left:0;z-index:10000;min-width:0;min-height:0;margin:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;background-color:var(--colorSlate1D2122);padding:0 var(--pageOuterPad,18px) var(--pageOuterPad,18px)}#app-battleoftriads-window .triads-frame #pageManual.stateManualOpen{display:block}#app-battleoftriads-window .triads-frame #pageManual .pageManualContent,#app-battleoftriads-window .triads-frame #pageManual .pageManualContent *{font-family:'Barlow',sans-serif;box-sizing:border-box}#app-battleoftriads-window .triads-frame #pageManual .pageManualContent{width:min(900px,100%);margin:0 auto var(--pageOuterPad,18px);padding:0;border:0;border-radius:0;background-color:transparent;box-shadow:none;color:var(--colorGrayF2)}#app-battleoftriads-window .triads-frame #pageManual .pageManualHeader{display:flex;align-items:flex-start;justify-content:center;width:100%;height:auto;margin:0 0 var(--pageGap,14px);margin-left:calc(50% - 50%);padding:calc((var(--sizeBar) - var(--fontTopBar,calc((var(--sizeBar) * .34) + 2px))) / 2) 0 0;border:0;border-radius:0;text-align:center}#app-battleoftriads-window .triads-frame #pageManual .pageManualContent h1{margin:0;padding:0;color:var(--colorGrayF2);font-family:'Cinzel',Georgia,serif;font-size:var(--fontManualTitle,calc(var(--fontTopBar,calc((var(--sizeBar) * .34) + 2px)) - 2px));line-height:1;font-weight:700;letter-spacing:.01em}#app-battleoftriads-window .triads-frame #pageManual .pageManualBody{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--pageGap,12px);width:100%;margin:0;padding:0}#app-battleoftriads-window .triads-frame #pageManual .pageManualSection{min-width:0;margin:0;padding:var(--pageSectionPadY,14px) var(--pageSectionPadX,16px) var(--pageSectionPadBottom,15px);border:1px solid var(--colorGray2D);border-radius:var(--pagePanelRadius,9px);background-color:var(--colorGray18a035)}#app-battleoftriads-window .triads-frame #pageManual .pageManualContent h2{margin:0;padding:0;border:0;background:none;color:var(--colorGrayF2);font-size:var(--fontManualHeading,18px);line-height:1.3;font-weight:700;letter-spacing:.005em}#app-battleoftriads-window .triads-frame #pageManual .pageManualContent p{margin:0 0 var(--pageParagraphGap,9px);padding:0;color:var(--colorGrayF2);font-size:var(--fontManualBody,16px);line-height:1.55;font-weight:400}#app-battleoftriads-window .triads-frame #pageManual .pageManualContent p:last-child{margin-bottom:0}#app-battleoftriads-window .triads-frame #pageManual .pageManualContent strong{font-weight:700}#app-battleoftriads-window .triads-frame #pageManual .pageManualAsterisk{color:#ff0000;font-weight:700}#app-battleoftriads-window .triads-frame #pageManual .pageManualDevelopment{min-width:0;margin:0;padding:0;border:0;border-radius:0;background-color:transparent;box-shadow:none;text-align:right}#app-battleoftriads-window .triads-frame #pageManual .pageManualBeginnerAI,#app-battleoftriads-window .triads-frame #pageManual .pageManualExpertPlayer{color:#9abed8}#app-battleoftriads-window .triads-frame #pageManual .pageManualBeginnerPlayer,#app-battleoftriads-window .triads-frame #pageManual .pageManualExpertAI{color:#ed5564}#app-battleoftriads-window .triads-frame #pageManual .pageManualIntermediatePlayer{color:#ffdc50}#app-battleoftriads-window .triads-frame #pageManual .pageManualIntermediateAI{color:#ccff00}#app-battleoftriads-window .triads-frame #pageManual .pageManualContent blockquote{margin:var(--pageQuoteGap,10px) 0;padding:var(--pageQuotePadY,10px) var(--pageQuotePadX,12px);border:1px solid var(--colorGray35);border-left:3px solid var(--colorGray44);border-radius:var(--pageQuoteRadius,7px);background-color:transparent;color:var(--colorGrayF2);font-size:var(--fontManualBody,16px);line-height:1.55}/*--------------------------------------------------------------------------------
	UI
	Top bar, footer bar and game menu.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame .uiTopBar,#app-battleoftriads-window .triads-frame .uiFooterBar{width:100%;display:flex;align-items:center;justify-content:center;letter-spacing:.08em;background-color:var(--colorGray11a000);transition:background-color .6s ease}#app-battleoftriads-window .triads-frame .uiTopBar{position:relative;z-index:60;height:var(--sizeBar);margin:calc(var(--sizeDeckPad) * -1) calc(var(--sizeDeckPad) * -1) 0;width:calc(100% + (var(--sizeDeckPad) * 2));flex:0 0 var(--sizeBar);color:var(--colorGrayF2);font-size:var(--fontTopBar,calc((var(--sizeBar) * .34) + 2px));background-color:var(--colorGray15a100)}#app-battleoftriads-window .triads-frame .uiTopBarWrap{position:relative;width:min(var(--sizeAIHandContentW,950px),100%);height:100%;display:flex;align-items:center;justify-content:center;padding:0 var(--sizeTopBarSide,52px);transition:width .35s cubic-bezier(.215,.61,.355,1)}#app-battleoftriads-window .triads-frame .uiTopBarWrap.uiTopBarManualWidth{width:min(900px,calc(100% - (var(--pageOuterPad,18px) * 2)))}#app-battleoftriads-window .triads-frame .uiTopBarLabel{position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--colorGrayF2)}#app-battleoftriads-window .triads-frame .uiTopBarLabel::after{content:attr(data-label);position:absolute;inset:0;background:linear-gradient(90deg,var(--uiTopBarToneA),var(--uiTopBarToneB),var(--uiTopBarToneA));background-size:200% 100%;background-position:0 50%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;opacity:0;transition:opacity .7s ease;pointer-events:none}#app-battleoftriads-window .triads-frame .uiTopBarLabel.uiTopBarDifficultyBeginner{--uiTopBarToneA:#9abed8;--uiTopBarToneB:#ed5564}#app-battleoftriads-window .triads-frame .uiTopBarLabel.uiTopBarDifficultyMedium{--uiTopBarToneA:#ffdc50;--uiTopBarToneB:#ccff00}#app-battleoftriads-window .triads-frame .uiTopBarLabel.uiTopBarDifficultyHard{--uiTopBarToneA:#ed5564;--uiTopBarToneB:#9abed8}#app-battleoftriads-window .triads-frame .uiTopBarLabel.uiTopBarDifficultyActive::after{opacity:1}#app-battleoftriads-window .triads-frame .uiFooterBar{height:var(--sizeFooterBar);margin:auto calc(var(--sizeDeckPad) * -1) calc(var(--sizeDeckPad) * -1);width:calc(100% + (var(--sizeDeckPad) * 2));flex:0 0 var(--sizeFooterBar);color:var(--colorGray99);font-size:var(--fontFooter,calc(var(--sizeBar) * .22));font-family:'Barlow',sans-serif;visibility:visible;background-color:inherit}#app-battleoftriads-window .triads-frame .uiFooterBar.stateBarBG{background-color:inherit}#app-battleoftriads-window .triads-frame .uiDeckIcon{position:absolute;top:50%;right:calc(var(--sizeMenuInset,5px) + var(--sizeMenuHit,42px) - 8px);z-index:40;width:var(--sizeMenuHit,42px);height:var(--sizeMenuHit,42px);display:grid;place-items:center;transform:translateY(-50%);pointer-events:none;-webkit-user-select:none;user-select:none}#app-battleoftriads-window .triads-frame .uiDeckIconBase{position:absolute;color:var(--colorGrayF2);font-family:'Material Symbols Outlined';font-style:normal;font-weight:400;font-size:calc(var(--sizeMenuLineW,24px) * 1.4);line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;transform:scaleX(.72) scaleY(1.08);transform-origin:center;-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased;font-feature-settings:'liga';font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0,'opsz' 24}#app-battleoftriads-window .triads-frame .uiGameMenu{position:absolute;top:50%;right:var(--sizeMenuInset,5px);z-index:40;width:var(--sizeMenuHit,42px);height:var(--sizeMenuHit,42px);border:0;background:transparent;padding:0;cursor:pointer;transform:translateY(-50%);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;touch-action:manipulation}#app-battleoftriads-window .triads-frame .uiGameMenuBook,#app-battleoftriads-window .triads-frame .uiGameMenuClose{position:absolute;left:50%;top:50%;color:var(--colorGrayF2);font-family:'Material Symbols Outlined';font-style:normal;font-weight:400;font-size:calc(var(--sizeMenuLineW,24px) * 1.2);line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;transform-origin:center;-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased;font-feature-settings:'liga';font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;transition:opacity .18s ease,transform .35s cubic-bezier(.215,.61,.355,1)}#app-battleoftriads-window .triads-frame .uiGameMenuBook{opacity:1;transform:translate(-50%,-50%) scale(1)}#app-battleoftriads-window .triads-frame .uiGameMenuClose{opacity:0;transform:translate(-50%,-50%) scale(.72)}#app-battleoftriads-window .triads-frame .uiGameMenu.stateManualClose .uiGameMenuBook{opacity:0;transform:translate(-50%,-50%) scale(.72)}#app-battleoftriads-window .triads-frame .uiGameMenu.stateManualClose .uiGameMenuClose{left:50%;right:auto;opacity:1;transform:translate(-50%,-50%) scale(1)}/*--------------------------------------------------------------------------------
	ARENA
	Deck strips and board area layout.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame .gameDeckArea,#app-battleoftriads-window .triads-frame .boardArea{min-width:0;min-height:0}#app-battleoftriads-window .triads-frame .gameDeckArea{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-self:stretch;align-self:stretch;overflow:visible;width:100%;max-width:100%;padding:var(--sizeDeckPad);background-color:var(--colorSlate1D2122a000);transition:background-color .6s ease}#app-battleoftriads-window .triads-frame .gameDeckArea.stateDeckBG{background-color:var(--colorGray18a100)}#app-battleoftriads-window .triads-frame .gameDeckArea.stateHidden{display:flex!important}#app-battleoftriads-window .triads-frame .gameDeckArea.stateHidden .gameHand{visibility:hidden}#app-battleoftriads-window .triads-frame #app.stateGameIntro>.gameDeckArea{visibility:visible}#app-battleoftriads-window .triads-frame #app.stateGameIntro>.gameDeckArea .gameHand{visibility:hidden}#app-battleoftriads-window .triads-frame .gameDeckArea.gameAI{order:1;height:100%}#app-battleoftriads-window .triads-frame .gameDeckArea.gameAI .gameHand{margin-top:var(--sizeDeckPad)}#app-battleoftriads-window .triads-frame .gameDeckArea.gamePlayer{order:3;height:auto}#app-battleoftriads-window .triads-frame .boardArea{order:2;z-index:2;width:100%;height:100%;align-self:stretch;justify-self:stretch;position:relative;display:flex;align-items:center;justify-content:center;padding:25px;max-width:none;max-height:none;overflow:hidden;touch-action:none}#app-battleoftriads-window .triads-frame .boardGrid{display:grid;grid-template-columns:repeat(3,var(--sizeCellW));grid-template-rows:repeat(3,var(--sizeCellH));gap:15px;touch-action:none}/*--------------------------------------------------------------------------------
	HANDS
	Hand rows and card stacking.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame .gameHand{display:flex;flex-flow:row nowrap;justify-content:center;align-items:center;gap:15px;border:0!important;overflow:hidden;width:min(950px,calc(100% + 40px));max-width:950px;height:100%;min-height:0;flex:1 1 auto;padding:0}#app-battleoftriads-window .triads-frame .gameHand>.cardHandSlot{position:relative;min-width:0;width:var(--sizeCardW);height:var(--sizeCardH);max-height:none;flex:0 0 var(--sizeCardW);border:1px solid var(--colorGray25);border-radius:10px;background-color:var(--colorGray15);background-image:repeating-linear-gradient(135deg,var(--colorWhite003) 0px,var(--colorWhite003) 2px,transparent 2px,transparent 11px)}#app-battleoftriads-window .triads-frame .gameHand>.cardHandSlot:nth-child(1){z-index:1}#app-battleoftriads-window .triads-frame .gameHand>.cardHandSlot:nth-child(2){z-index:2}#app-battleoftriads-window .triads-frame .gameHand>.cardHandSlot:nth-child(3){z-index:3}#app-battleoftriads-window .triads-frame .gameHand>.cardHandSlot:nth-child(4){z-index:4}#app-battleoftriads-window .triads-frame .gameHand>.cardHandSlot:nth-child(5){z-index:5}#app-battleoftriads-window .triads-frame .gameHand>.cardHandSlot+.cardHandSlot{margin-left:var(--sizeShift,0px)}#app-battleoftriads-window .triads-frame .gameHand>.cardHandSlot>.cardHand{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);max-height:none}#app-battleoftriads-window .triads-frame .gameHand>.cardHandSlot+.cardHandSlot>.cardHand{box-shadow:var(--shadowStack,0 8px 18px var(--colorBlack028))!important}/*--------------------------------------------------------------------------------
	BOARD
	Cells, drop target and capture marks.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame .boardCell{width:var(--sizeCellW);height:var(--sizeCellH);aspect-ratio:5/7;border-radius:10px;display:grid;place-items:center;position:relative;min-width:0;min-height:0;overflow:hidden;touch-action:none;--colorCellBorder:color-mix(in srgb,var(--colorSlate1D2122) 82%,var(--colorWhite));--colorCellBackground:color-mix(in srgb,var(--colorSlate1D2122) 86%,var(--colorBlack));--colorCellStripe:color-mix(in srgb,var(--colorCellBorder) 30%,var(--colorCellBackground))}#app-battleoftriads-window .triads-frame .boardCell:empty::before,#app-battleoftriads-window .triads-frame .boardCell.stateDropTarget::before{content:'';transition:opacity .55s ease;position:absolute;inset:0;border-radius:inherit;border:1px solid var(--colorCellBorder);background-color:var(--colorCellBackground);background-image:repeating-linear-gradient(135deg,var(--colorCellStripe) 0px,var(--colorCellStripe) 2px,transparent 2px,transparent 11px);opacity:var(--opacityCellSlot,1);transition:opacity .35s ease;pointer-events:none}#app-battleoftriads-window .triads-frame .boardCell.stateDropTarget{--colorCellBorder:var(--colorOwnerPlayer)}#app-battleoftriads-window .triads-frame .boardCell:not(:empty){border:0}#app-battleoftriads-window .triads-frame .boardCellGlow{position:absolute;inset:0;border-radius:10px;pointer-events:none}#app-battleoftriads-window .triads-frame .boardCell .cardBase{width:100%;height:100%;max-height:none;opacity:1}#app-battleoftriads-window .triads-frame .boardCell .cardStats.stateClosed,#app-battleoftriads-window .triads-frame .animDragGhost .cardStats.stateClosed{opacity:.25}@keyframes animStatGlowWin{0%,100%{text-shadow:0 0 3px var(--colorGreen),0 0 7px var(--colorGreen)}50%{text-shadow:0 0 6px var(--colorGreen),0 0 14px var(--colorGreen),0 0 22px var(--colorGreen)}}@keyframes animStatGlowLoss{0%,100%{text-shadow:0 0 3px var(--colorRed),0 0 7px var(--colorRed)}50%{text-shadow:0 0 6px var(--colorRed),0 0 14px var(--colorRed),0 0 22px var(--colorRed)}}#app-battleoftriads-window .triads-frame .cardStats.statePreview-win{opacity:1;color:var(--colorGrayF2);animation:animStatGlowWin 1.1s ease-in-out infinite}#app-battleoftriads-window .triads-frame .cardStats.statePreview-loss{opacity:1;color:var(--colorGrayF2);animation:animStatGlowLoss 1.1s ease-in-out infinite}#app-battleoftriads-window .triads-frame .boardCell .cardStats.stateCapture-win{opacity:1;color:var(--colorGreen008)}#app-battleoftriads-window .triads-frame .boardCell .cardStats.stateCapture-loss{opacity:1;color:var(--colorRed)}/*--------------------------------------------------------------------------------
	BOARDGRID
	Grid and empty slot design.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame .boardGrid.stateSlotsHidden{--opacityCellSlot:0}/*--------------------------------------------------------------------------------
	DECK
	Deck background and intro image.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame #gameIntroImage{position:absolute;left:50%;top:50%;width:calc((var(--sizeCellW,100px) * 3) + 30px);height:calc((var(--sizeCellH,140px) * 3) + 30px);transform:translate(-50%,-50%);z-index:3;border-radius:10px;background-position:center;background-size:cover;background-repeat:no-repeat;box-shadow:0 0 32px 8px var(--colorGray18a100);pointer-events:none;opacity:1;transition:opacity .3s ease,box-shadow .3s ease;transform-origin:top left;will-change:transform}#app-battleoftriads-window .triads-frame #gameIntroImage.deckIntroShadowHidden{box-shadow:0 0 0 0 var(--colorGray18a000)}/*--------------------------------------------------------------------------------
	CARDS
	Card face, stats, ownership and hand stacking.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame .gameHand .cardBase{opacity:var(--opacityHandCard,1)}#app-battleoftriads-window .triads-frame .gameHand.stateHandDealing{--opacityHandCard:0}#app-battleoftriads-window .triads-frame .gameHand .cardBase.stateDealt{opacity:1!important}#app-battleoftriads-window .triads-frame .cardBase{font-size:var(--sizeRank,16px);aspect-ratio:5/7;position:relative;border-radius:10px;overflow:hidden;border:1px solid var(--colorGray25);background-color:var(--colorGray11);background-position:center;background-size:cover;background-repeat:no-repeat;user-select:none;-webkit-user-select:none;touch-action:none;transition:transform .15s ease,border-color .15s ease,opacity .15s ease}#app-battleoftriads-window .triads-frame .gamePlayer .cardBase{cursor:grab}#app-battleoftriads-window .triads-frame .gamePlayer .cardBase:active{cursor:grabbing}#app-battleoftriads-window .triads-frame .cardBase.stateDragSource{opacity:.24}#app-battleoftriads-window .triads-frame .cardStats{position:static;display:flex;align-items:center;justify-content:center;font-family:inherit;font-size:inherit;z-index:7;text-shadow:0 2px 3px var(--colorBlack),0 4px 8px var(--colorBlack),0 0 5px var(--colorBlack),0 0 2px var(--colorBlack);pointer-events:none}#app-battleoftriads-window .triads-frame .cardStatsCorner{position:absolute;top:4%;left:4%;display:grid;grid-template-columns:repeat(3,.8em);grid-template-rows:repeat(3,.8em);place-items:center;font-size:inherit;z-index:8;pointer-events:none}#app-battleoftriads-window .triads-frame .cardStatsCorner .cardStats{font-size:inherit;width:.8em;height:.8em;transition:opacity .26s ease}#app-battleoftriads-window .triads-frame .cardStatsCorner .cardStats.cardStat-top{grid-column:2;grid-row:1}#app-battleoftriads-window .triads-frame .cardStatsCorner .cardStats.cardStat-left{grid-column:1;grid-row:2}#app-battleoftriads-window .triads-frame .cardStatsCorner .cardStats.cardStat-right{grid-column:3;grid-row:2}#app-battleoftriads-window .triads-frame .cardStatsCorner .cardStats.cardStat-bottom{grid-column:2;grid-row:3}#app-battleoftriads-window .triads-frame .cardBase.cardHue-1{filter:hue-rotate(-14deg)}#app-battleoftriads-window .triads-frame .cardBase.cardHue-2{filter:hue-rotate(-10deg)}#app-battleoftriads-window .triads-frame .cardBase.cardHue-3{filter:hue-rotate(-7deg)}#app-battleoftriads-window .triads-frame .cardBase.cardHue-4{filter:hue-rotate(-4deg)}#app-battleoftriads-window .triads-frame .cardBase.cardHue-5{filter:hue-rotate(4deg)}#app-battleoftriads-window .triads-frame .cardBase.cardHue-6{filter:hue-rotate(7deg)}#app-battleoftriads-window .triads-frame .cardBase.cardHue-7{filter:hue-rotate(10deg)}#app-battleoftriads-window .triads-frame .cardBase.cardHue-8{filter:hue-rotate(14deg)}#app-battleoftriads-window .triads-frame .boardCell .cardBase.cardOwner-player{border-color:var(--colorOwnerPlayer)}#app-battleoftriads-window .triads-frame .boardCell .cardBase.cardOwner-ai{border-color:var(--colorOwnerAI)}#app-battleoftriads-window .triads-frame .gameDeckArea.stateInactive.gamePlayer .cardHand{opacity:.25!important;pointer-events:none;cursor:default}#app-battleoftriads-window .triads-frame .gameDeckArea.stateInactive.gameAI .cardAIBack{opacity:.25}#app-battleoftriads-window .triads-frame .cardBase.cardAIHand{box-shadow:0 8px 18px var(--colorBlack028)}#app-battleoftriads-window .triads-frame .cardAIBack{position:absolute;inset:0;z-index:9;border:0;border-radius:inherit;overflow:hidden;background-image:var(--imageBackdeck);background-position:center;background-size:cover;background-repeat:no-repeat;backface-visibility:hidden;transition:opacity 120ms linear}/*--------------------------------------------------------------------------------
	CARDS > ANIMATIONS
	Deal ghosts, flip faces, drag and scatter.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame .animDealCardGhost{position:absolute;z-index:9999;transition:none;pointer-events:none;border-radius:10px;background-image:var(--imageBackdeck);background-position:center;background-size:cover;background-repeat:no-repeat}#app-battleoftriads-window .triads-frame .animCardFlipOuter{perspective:1000px}#app-battleoftriads-window .triads-frame .animCardFlipInner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.3,.7,.4,1)}#app-battleoftriads-window .triads-frame .animCardFlipInner.stateFlipped{transform:rotateY(180deg)}#app-battleoftriads-window .triads-frame .animCardFlipFace{position:absolute;inset:0;backface-visibility:hidden;border-radius:10px;overflow:hidden}#app-battleoftriads-window .triads-frame .animCardFlipFace.animCardFlipFront{transform:rotateY(180deg)}#app-battleoftriads-window .triads-frame .animCardFlipFace.animCardFlipBack{background-image:var(--imageBackdeck);background-position:center;background-size:cover;background-repeat:no-repeat}#app-battleoftriads-window .triads-frame .animDragGhost{position:absolute;z-index:9999;pointer-events:none;transform-origin:var(--dragOriginX,50%) var(--dragOriginY,50%);transform:rotate(var(--dragRotate,2deg)) scale(var(--dragScaleX,1.03),var(--dragScaleY,1.03));transition:transform .18s cubic-bezier(.215,.61,.355,1);opacity:.96}#app-battleoftriads-window .triads-frame .animDragGhost .cardBase{width:100%;height:100%;cursor:grabbing}#app-battleoftriads-window .triads-frame #app.stateDragging{cursor:grabbing}#app-battleoftriads-window .triads-frame .stateAIMovingSource{visibility:hidden!important}#app-battleoftriads-window .triads-frame .animAIMoveGhost{position:absolute;z-index:9999;pointer-events:none;transform-origin:top left;will-change:transform;opacity:1!important}#app-battleoftriads-window .triads-frame .animForfeitScatterGhost{position:absolute;z-index:9998;pointer-events:none;transform-origin:center center;will-change:transform}/*--------------------------------------------------------------------------------
	DICE
	Dice stage, cube faces and numerals.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame .animDiceStage{position:absolute;inset:0;overflow:visible;perspective:900px;pointer-events:none;z-index:20}#app-battleoftriads-window .triads-frame .animDiceWrap{position:absolute;width:var(--sizeDice);height:var(--sizeDice);will-change:transform;transition:opacity .35s ease;z-index:5}#app-battleoftriads-window .triads-frame .animDiceWrap.animDice-player{left:40%;top:38%}#app-battleoftriads-window .triads-frame .animDiceWrap.animDice-ai{right:40%;top:38%}#app-battleoftriads-window .triads-frame .animDiceScene{position:relative;width:var(--sizeDice);height:var(--sizeDice);perspective:760px;transform-style:preserve-3d}#app-battleoftriads-window .triads-frame .animDiceCube{width:100%;height:100%;position:relative;transform-style:preserve-3d;transform:rotateX(-18deg) rotateY(28deg) rotateZ(0deg);transform-origin:50% 50%;transition:none;will-change:transform}#app-battleoftriads-window .triads-frame .animDiceFace{display:flex;align-items:center;justify-content:center;font-size:calc(var(--sizeDice) * .44);letter-spacing:.04em;color:var(--colorBlack);position:absolute;inset:0;border-radius:17px;border:1px solid var(--colorBlack);background-image:linear-gradient(145deg,var(--colorWhite) 0%,var(--colorGrayE6) 48%,var(--colorGrayB8) 100%);box-shadow:inset 5px 5px 14px var(--colorWhite090),inset -7px -7px 15px var(--colorGray50028);backface-visibility:hidden}#app-battleoftriads-window .triads-frame .animDiceFace-1{transform:translateZ(var(--sizeDiceHalf))}#app-battleoftriads-window .triads-frame .animDiceFace-6{transform:rotateY(180deg) translateZ(var(--sizeDiceHalf))}#app-battleoftriads-window .triads-frame .animDiceFace-2{transform:rotateY(90deg) translateZ(var(--sizeDiceHalf))}#app-battleoftriads-window .triads-frame .animDiceFace-5{transform:rotateY(-90deg) translateZ(var(--sizeDiceHalf))}#app-battleoftriads-window .triads-frame .animDiceFace-3{transform:rotateX(90deg) translateZ(var(--sizeDiceHalf))}#app-battleoftriads-window .triads-frame .animDiceFace-4{transform:rotateX(-90deg) translateZ(var(--sizeDiceHalf))}#app-battleoftriads-window .triads-frame .animDice-player .animDiceFace{box-shadow:inset 5px 5px 14px var(--colorWhite090),inset -7px -7px 15px var(--colorGray50028),0 0 26px 4px var(--colorBlue040)}#app-battleoftriads-window .triads-frame .animDice-ai .animDiceFace{box-shadow:inset 5px 5px 14px var(--colorWhite090),inset -7px -7px 15px var(--colorGray50028),0 0 26px 4px var(--colorRed040)}#app-battleoftriads-window .triads-frame .animDiceStage.stateResolved .animDiceWrap{opacity:0;pointer-events:none}/*--------------------------------------------------------------------------------
	DEBUG > AI CARD FLIP
	AI hand reveal while gameDebug is on.
---------------------------------------------------------------------------------*/
#app-battleoftriads-window .triads-frame .gameAI .gameHand .cardAIHand .cardStatsCorner{visibility:hidden}#app-battleoftriads-window .triads-frame .gameAI .gameHand .cardAIHand.stateDebugOpen .cardStatsCorner{visibility:visible}#app-battleoftriads-window .triads-frame .gameAI .gameHand .cardAIHand.stateDebugOpen .cardAIBack{visibility:hidden}#app-battleoftriads-window .triads-frame .cardAIHand.stateDebugSpinning{will-change:transform}/*--------------------------------------------------------------------------------
	RESPONSIVE > HOVER
	Pointer-capable devices only.
---------------------------------------------------------------------------------*/
@media(hover:hover) and (pointer:fine){#app-battleoftriads-window .triads-frame .gamePlayer .gameHand{overflow:visible}#app-battleoftriads-window .triads-frame .gamePlayer .cardHandSlot:hover{z-index:20}#app-battleoftriads-window .triads-frame .gamePlayer .cardBase:hover{transform:translateY(-30px) scale(1.05)}}/*--------------------------------------------------------------------------------
	RESPONSIVE > REDUCED MOTION
	Motion removed when the system asks for it.
---------------------------------------------------------------------------------*/
@media(prefers-reduced-motion:reduce){#app-battleoftriads-window .triads-frame .cardBase,#app-battleoftriads-window .triads-frame .cardAIBack,#app-battleoftriads-window .triads-frame .uiTopBarLabel::after{transition:none}}