﻿.profileCardOverlay{position:fixed;inset:0;z-index:1250;display:grid;place-items:center;overflow:auto;padding:clamp(.4rem,2vw,1.25rem);background:radial-gradient(ellipse at 50% 18%,#536b68dd,#152322f5 72%);color:#253c3b;font:500 14px/1.35 system-ui,sans-serif;overscroll-behavior:contain}.profileCardOverlay[hidden]{display:none}.profileCardBadge{position:relative;width:min(100%,640px);max-height:calc(100dvh - .8rem);overflow:auto;padding:1rem clamp(.8rem,3vw,1.5rem) 1.2rem;border:5px solid #c8a968;border-radius:18px;background:linear-gradient(145deg,#f8efd9,#e8d8b4 72%,#d4c093);box-shadow:0 18px 55px #0009,inset 0 0 0 2px #fff9}.profileCardLanyard{width:max-content;max-width:100%;margin:-1rem auto .65rem;padding:.35rem .9rem;border:1px solid #8ca6a0;border-top:0;border-radius:0 0 10px 10px;background:#315c59;color:#f4e6c3;font-size:.67rem;font-weight:900;letter-spacing:.13em;text-align:center}.profileCardToolbar{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.15rem 1rem;border-bottom:2px solid #9a8052;padding-bottom:.6rem}.profileCardTitle{margin:0;font-size:clamp(1.1rem,3vw,1.55rem);letter-spacing:.03em}.profileCardScope{grid-column:1;margin:0;color:#45615b;font-size:.67rem;font-weight:900;letter-spacing:.09em}.profileCardClose,.profileCardFlip,.profileCardPlaques{border:1px solid #315c59;border-radius:7px;background:#315c59;color:#fff3d3;padding:.48rem .75rem;font:700 .8rem/1.2 inherit;cursor:pointer}.profileCardClose{grid-column:2;grid-row:1/3}.profileCardClose:focus-visible,.profileCardFlip:focus-visible,.profileCardPlaques:focus-visible,.profileCardFighterSelect:focus-visible{outline:3px solid #b44732;outline-offset:2px}.profileCardFlipper{position:relative;min-height:280px;margin-top:.75rem;transform-style:preserve-3d;transition:transform .42s ease}.profileCardOverlay.isBack .profileCardFlipper{transform:rotateY(180deg)}.profileCardFace{position:absolute;inset:0;display:grid;grid-template-columns:minmax(105px,155px) 1fr;grid-template-rows:auto auto auto 1fr auto;align-content:start;gap:.35rem .9rem;padding:.2rem .15rem;backface-visibility:hidden}.profileCardFront{transform:rotateY(0)}.profileCardBack{transform:rotateY(180deg);grid-template-columns:1fr;grid-template-rows:auto 1fr auto auto}.profileCardPreview{grid-column:1;grid-row:1/5;display:grid;place-items:center;align-self:stretch;min-height:165px;overflow:hidden;border:3px solid #b69b63;border-radius:12px;background:radial-gradient(ellipse at center,#b8d0c5,#456764 75%);box-shadow:inset 0 0 18px #183d3a88}.profileCardPreview canvas{display:block;width:100%;height:100%;min-height:160px}.profileCardPortrait{width:100%;height:100%;max-height:210px;object-fit:contain}.profileCardPortraitFallback{padding:.5rem;color:#fff2ce;text-align:center;font-weight:800}.profileCardDisplayTitle{grid-column:2;margin:.25rem 0 0;color:#304e4c;font-size:clamp(1rem,2.8vw,1.35rem);line-height:1.12}.profileCardDepartment,.profileCardNameplate{grid-column:2;margin:0;color:#5a4a30;font-size:.82rem}.profileCardNameplate{font-style:italic}.profileCardSelectorLabel{grid-column:2;align-self:end;margin-top:.2rem;color:#385753;font-size:.72rem;font-weight:800}.profileCardFighterSelect{grid-column:2;width:100%;min-width:0;padding:.43rem;border:1px solid #a18b5e;border-radius:6px;background:#fff9e9;color:#283e3b;font:inherit}.profileCardStats{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.2rem .35rem;margin:.35rem 0 0;padding:.55rem .4rem;border-top:1px solid #b8a378;border-bottom:1px solid #b8a378}.profileCardStats dt{color:#62604f;font-size:.65rem;font-weight:800;text-align:center}.profileCardStats dd{margin:0;color:#294644;font-size:1rem;font-weight:900;text-align:center}.profileCardFlip{grid-column:1/-1;justify-self:end;margin-top:.15rem}.profileCardBackTitle{margin:.3rem 0;color:#304e4c}.profileCardTopFighters{display:grid;gap:.45rem;margin:0;padding:0;list-style:none;counter-reset:fighter}.profileCardTopFighter{counter-increment:fighter;display:flex;align-items:center;gap:.65rem;padding:.55rem .65rem;border:1px solid #b8a378;border-radius:7px;background:#f7ecd2;font-weight:800}.profileCardTopFighter:before{content:counter(fighter);display:grid;place-items:center;width:1.65rem;height:1.65rem;border-radius:50%;background:#315c59;color:white}.profileCardPlaques{justify-self:start;margin-top:.5rem}.profileCardOverlay.isOpen .profileCardBadge{animation:profileCardFadeIn .22s ease-out both}.profileCardOverlay:not(.isOpen) .profileCardBadge{animation:none}@keyframes profileCardFadeIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){.profileCardOverlay{place-items:center;padding:.3rem}.profileCardBadge{width:min(100%,600px);max-height:calc(100dvh - .6rem);padding:.65rem .75rem .8rem;border-width:3px}.profileCardLanyard{margin-top:-.65rem;margin-bottom:.35rem;padding:.25rem .65rem;font-size:.58rem}.profileCardToolbar{padding-bottom:.35rem}.profileCardTitle{font-size:1.05rem}.profileCardScope{font-size:.58rem}.profileCardClose{padding:.38rem .55rem;font-size:.7rem}.profileCardFlipper{min-height:225px;margin-top:.35rem}.profileCardFace{grid-template-columns:minmax(86px,120px) 1fr;gap:.22rem .55rem}.profileCardPreview{min-height:130px}.profileCardPreview canvas{min-height:125px}.profileCardDisplayTitle{font-size:1rem}.profileCardDepartment,.profileCardNameplate{font-size:.7rem}.profileCardStats{gap:.12rem;margin-top:.2rem;padding:.35rem .15rem}.profileCardStats dt{font-size:.56rem}.profileCardStats dd{font-size:.85rem}.profileCardFlip,.profileCardPlaques{padding:.38rem .55rem;font-size:.72rem}}
/* Only the visible face determines badge height. The reverse stays available
   for the flip without stretching the front around its taller list. */
.profileCardFace[aria-hidden="true"]{position:absolute;inset:0;pointer-events:none}
.profileCardFace[aria-hidden="false"]{align-self:start}
@media(prefers-reduced-motion:reduce){.profileCardFlipper{transition:none}.profileCardOverlay.isOpen .profileCardBadge{animation:none}}
/* Keep both flip faces in one sizing grid so their full content contributes to the badge height. */
.profileCardFlipper{display:grid;grid-template:1fr/1fr}.profileCardFace{position:relative;inset:auto;grid-area:1/1}
@media(max-height:430px) and (orientation:landscape){.profileCardBadge{padding:.4rem .75rem .5rem}.profileCardLanyard{margin:-.4rem auto .25rem;padding:.2rem .6rem;font-size:.58rem}.profileCardToolbar{padding-bottom:.25rem}.profileCardTitle{font-size:1rem}.profileCardScope{font-size:.57rem}.profileCardClose{padding:.34rem .55rem;font-size:.68rem}.profileCardFlipper{min-height:210px;margin-top:.25rem}.profileCardPreview{height:120px;min-height:120px}.profileCardPreview canvas{min-height:115px}.profileCardStats{grid-template-columns:repeat(4,minmax(0,1fr));gap:.1rem;margin-top:.15rem;padding:.25rem .15rem}.profileCardStat{display:grid;grid-template-rows:auto auto;align-content:center;gap:.08rem;min-width:0}.profileCardStats dt{font-size:.55rem;line-height:1.05}.profileCardStats dd{font-size:.8rem;line-height:1}.profileCardFlip{padding:.34rem .5rem;font-size:.68rem}}
@media(max-height:360px) and (orientation:landscape){.profileCardOverlay{padding:.1rem}.profileCardBadge{max-height:calc(100dvh - .2rem);padding:.25rem .55rem .1rem;border-width:2px}.profileCardLanyard{margin:0 auto .1rem;padding:.15rem .5rem}.profileCardToolbar{padding-bottom:.15rem}.profileCardFlipper{min-height:150px;margin-top:.1rem}.profileCardFace{grid-template-columns:86px 1fr;gap:.08rem .35rem;padding:.1rem}.profileCardPreview{height:94px;min-height:94px}.profileCardPreview canvas{min-height:88px}.profileCardDisplayTitle{font-size:.82rem}.profileCardDepartment,.profileCardNameplate{font-size:.61rem}.profileCardSelectorLabel{margin-top:.08rem;font-size:.57rem}.profileCardFighterSelect{padding:.2rem;font-size:.68rem}.profileCardStats{gap:.05rem;margin-top:.08rem;padding:.12rem .08rem}.profileCardStat{gap:.04rem}.profileCardStats dt{font-size:.5rem}.profileCardStats dd{font-size:.7rem}.profileCardFlip{padding:.24rem .38rem;font-size:.61rem}}
