/* Original printed-card treatment shared by the deck, tests and character sheets. */
.modalBox:has(.cardSalon){width:min(1240px,96vw);max-width:1240px;background:linear-gradient(110deg,#202b23ed,#121e19f5),url('assets/painted-realm.webp') center/cover;border:1px solid #b8a077;padding:30px}
.salonHeading{text-align:center;border-bottom:1px solid #ae956d70;padding:0 25px 18px}.salonHeading>small{color:#d4bd86;font-size:10px;letter-spacing:2px}.salonHeading h2{font-size:34px;margin:8px 0}.salonHeading p{font-size:13px;margin:0}.salonTop{display:grid;grid-template-columns:1.1fr 1fr;gap:20px;margin:22px 0}.salonHero{display:flex;min-height:235px;background:linear-gradient(120deg,#f6e9ca,#ddc59a);color:#3b3023;border:double 5px #88724e;box-shadow:0 9px 20px #0005;position:relative}.salonPortrait{width:35%;min-width:130px;background-position:0 0;border-right:2px solid #97815c;position:relative}.salonPortrait span{position:absolute;bottom:0;left:0;right:0;padding:10px 4px;text-align:center;background:#302a20e8;color:#ead6a4;font-size:9px;letter-spacing:1px}.salonIdentity{padding:16px;flex:1;min-width:0}.salonIdentity h2{font-size:30px;margin:4px 0 12px;overflow-wrap:anywhere}.salonIdentity small{font-size:11px;color:#72603f}.salonIdentity p{font-size:11px;color:#61513a;margin:13px 0 0}.salonStats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}.salonStats span{font-size:9px;border-top:1px solid #9c8350;padding-top:7px}.salonStats b{display:block;font:23px Georgia;color:#72352b}
.salonLoadout{padding:18px;border:1px solid #a38c5d6b;background:#18251dd9}.salonLoadout>small{font-size:10px;color:#dfc392;letter-spacing:2px}.salonLoadout>div{display:flex;gap:10px;flex-wrap:wrap;margin:15px 0}.salonLoadout>div>span{display:flex;flex-direction:column;align-items:center;width:62px;text-align:center}.salonLoadout .itemArt{width:54px;height:54px;border:2px solid #b39964;box-shadow:0 3px 6px #0006}.salonLoadout b{font-size:10px;font-weight:500;margin-top:5px}.salonLoadout p{font-size:11px;margin:10px 0 0;color:#d8cba9}.salonDrawHead{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:22px 0 16px}.salonDrawHead h3{font-size:26px;margin:0}.salonDrawHead p{font-size:12px;margin:4px 0 0}.salonDrawHead button{flex-shrink:0}.abilityHand{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;perspective:1600px;padding:10px 0 15px}.abilitySlot{padding:0;border:0;background:none!important;border-radius:7px;text-align:left;min-width:0;box-shadow:0 8px 15px #0006;transition:transform .2s;animation:dealAbility .45s both;animation-delay:var(--deal-delay,0ms)}.abilitySlot:hover:not(:disabled){transform:translateY(-7px) rotate(-1deg);box-shadow:0 13px 23px #0008}.abilitySlot:focus-visible{outline:3px solid #f8d995;outline-offset:5px}.abilitySlot.revealed{animation:flipAbility .4s ease-out}.abilityCard{height:100%;min-height:310px;background:linear-gradient(125deg,#f9efd9,#e1cba6);color:#352d23;border:5px solid #e9dbb6;outline:1px solid #79623e;outline-offset:-7px;border-radius:7px;overflow:hidden;position:relative;box-shadow:inset 0 0 0 1px #7e6843}.abilityCard>header{display:flex;justify-content:space-between;align-items:center;gap:4px;background:var(--card-ink);color:#fff4d9;padding:9px 8px;font:14px Georgia;min-height:39px}.abilityCard>header b{font-size:11px;white-space:nowrap;color:#f7dc93}.abilityArt{aspect-ratio:1;background-image:url('assets/ability-scenes.webp');background-size:400% 200%;border-bottom:3px solid var(--card-ink);background-repeat:no-repeat;position:relative}.abilityPaper{padding:10px 9px 8px}.abilityPaper>small{font:8px system-ui;letter-spacing:1px;text-transform:uppercase;color:#76644b}.abilityPaper h3{font:bold 18px/1.2 Georgia;margin:4px 0 9px;color:#3f2f20}.abilityPaper p{font:11px/1.5 system-ui;color:#5f4c35;margin:0;min-height:49px}.abilityPaper footer{display:block;background:none;border:0;border-top:1px solid #ab936760;padding:7px 0 0;margin:9px 0 0;min-height:0;height:auto;font:9px system-ui;color:#795f3d}.matchingCard{outline:3px solid #83a564;outline-offset:2px}.matchingCard .abilityPaper footer{color:#426038;font-weight:700}.effortCard .abilityArt{background:radial-gradient(ellipse,#dac498,#746248);display:grid;place-items:center;color:#f6e5b8}.effortCard .abilityArt>span{font:100px Georgia;filter:drop-shadow(0 4px 2px #3d302e)}
.abilityBack{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:370px;height:100%;padding:20px 10px;text-align:center;background:repeating-linear-gradient(45deg,#243d33 0,#243d33 8px,#294237 8px,#294237 9px);border:6px solid #dac393;border-radius:7px;outline:1px solid #7b6239;outline-offset:-11px;box-shadow:inset 0 0 35px #0008;color:#e9d29d}.abilityBack small{font-size:9px;letter-spacing:3px;color:#d9c59c}.abilityBack>b{font:85px Georgia;margin:13px 0;color:#d7b66f}.abilityBack>span{font:20px/1.5 Georgia;letter-spacing:2px}.abilityBack em{font:10px system-ui;color:#dcc89d;margin-top:25px}.salonDrawFooter{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#d5c197}.salonDrawFooter button{font-size:12px}.abilityDetail{padding:14px 18px;margin:15px 0;border-left:3px solid #ad8c57;background:#19251e;color:#d9cbaa;font:13px/1.7 system-ui}.salonRules,.salonCollection{border-top:1px solid #95825d66;padding:14px 0}.salonRules summary,.salonCollection summary{font:16px Georgia;color:#e4d1a3}.salonRules p{font-size:13px;margin:12px 0}.deckOdds{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.deckOdds span{border:1px solid #b4975c50;padding:10px;color:#e9d196;font:22px Georgia}.deckOdds b,.deckOdds small{display:block;font:12px system-ui}.deckOdds small{font-size:10px;color:#bbb69e;margin-top:4px}.abilityCollection{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:15px;padding:20px 2px}.emptyDeck{grid-column:1/-1;text-align:center;padding:25px;border:1px dashed #b1986d;background:#19271fac}.emptyDeck>span{font:70px Georgia;color:#cbb27b}.emptyDeck h3{margin:0}.emptyDeck p{font-size:13px;margin:10px 0}
@keyframes dealAbility{from{opacity:0;transform:translateY(30px) rotate(5deg)}to{opacity:1;transform:none}}@keyframes flipAbility{from{opacity:.2;transform:rotateY(-85deg)}to{opacity:1;transform:rotateY(0)}}
.illustratedTest{margin-top:20px;padding-top:15px;border-top:1px solid #88764c}.illustratedTest h3{margin:5px 0}.testVerdict{font-size:12px;color:#e2ac96}.testVerdict.testSuccess{color:#b8d28a}.testCardRow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.testCardRow .abilityCard{min-height:0;border-width:3px}.testCardRow .abilityCard header{font-size:11px;padding:7px 4px;display:block}.testCardRow .abilityCard header b{display:block;font-size:10px}.testCardRow .abilityPaper{padding:7px 5px}.testCardRow .abilityPaper h3{font-size:13px;overflow-wrap:anywhere}.testCardRow .abilityPaper p{font-size:10px;min-height:0}.testCardRow .abilityPaper footer{font-size:8px}.testCardRow .abilityPaper small{font-size:7px}
.characterPanel .heroCard,.lordHero{padding:13px;background:linear-gradient(115deg,#f5e9cf,#d8bf93);border:double 5px #89714a;border-radius:5px;box-shadow:0 9px 20px #0007;color:#392f23}.characterPanel .heroCard .muted,.characterPanel .heroCard small,.characterPanel .heroCard p,.lordHero p,.lordHero .hint{color:#68583f}.characterPanel .heroCard h1,.lordHero h2{color:#38281e}.characterPanel .heroCard .heroStats{border-color:#a28b5e}.characterPanel .heroCard .heroStats b{color:#723d2f}.characterPanel .heroCard .heroPortrait{border:1px solid #87704b;box-shadow:0 3px 9px #0004}.characterPanel .heroCard .vital{color:#5c4932}.characterPanel .heroCard .meter{background:#c2b08a}.characterPanel .heroCard #heroCardBtn{margin:10px 0;font-size:12px;background:#344c3d;color:#f8e6ba}.lordHero .lordCardCaption{background:#eee0bd;color:#473b27}.lordHero .lordCardCaption small{color:#776140}.lordHero .lordStats{background:#e7d5ad;border-color:#a78b5a;color:#604a31}.lordHero .lordStats b{color:#7b3b2f}
.npcHead{background:linear-gradient(100deg,#eadbb8,#d7bc91);border:double 5px #917345;padding:16px;color:#3a2d21;box-shadow:0 6px 16px #0004}.npcHead h2,.npcHead p{color:#4a3826}.npcHead .eyebrow{color:#79603e}.npcHead .portrait{border:3px solid #ad9266;box-shadow:0 3px 6px #0004}
.lords-mode #cardsBtn{display:none!important}
@media(max-width:950px){.salonTop{grid-template-columns:1fr}.salonHero{max-width:580px;margin:auto;width:100%}.salonLoadout{padding:12px}.salonLoadout>div{margin:8px 0}.abilityHand{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px 5px 20px}.abilitySlot{flex:0 0 190px;scroll-snap-align:center}.abilityCollection{grid-template-columns:repeat(3,1fr)}.salonHeading h2{font-size:28px}}
@media(max-width:600px){.modalBox:has(.cardSalon){padding:35px 15px 20px}.salonHeading{padding:0 0 15px}.salonHeading h2{font-size:26px}.salonHero{min-height:220px}.salonPortrait{min-width:95px}.salonIdentity{padding:12px}.salonIdentity h2{font-size:24px}.salonStats{grid-template-columns:repeat(2,1fr)}.salonDrawHead{display:block}.salonDrawHead button{margin-top:12px;width:100%}.abilityCollection{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.deckOdds{grid-template-columns:repeat(2,1fr)}.abilityCollection .abilityCard{min-height:0}.abilityCollection .abilityPaper h3{font-size:16px}.salonLoadout>div>span{width:52px}.salonLoadout .itemArt{width:45px;height:45px}}
@media(prefers-reduced-motion:reduce){.abilitySlot,.abilitySlot.revealed{animation:none;transition:none}}
.skillScene{display:block;width:64px;height:64px;flex:none;background-image:url('assets/ability-scenes.webp');background-size:400% 200%;border:2px solid #bba06c;border-radius:3px;box-shadow:0 4px 7px #0005}.skillCard .skillSeal{display:none}.salonLastTest{border-top:1px solid #a68b5a6b;padding:18px 0}.salonLastTest>small{font-size:10px;color:#d7be88;letter-spacing:2px}.salonLastTest h3{margin:7px 0}.salonLastTest p{font-size:12px}.salonLastTest .abilityCollection{grid-template-columns:repeat(3,minmax(0,210px));justify-content:center}
#top{height:auto;min-height:80px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px}#top nav{flex-wrap:wrap;justify-content:flex-end}@media(max-width:680px){#top nav{justify-content:flex-start}.skillScene{width:50px;height:50px}.salonLastTest .abilityCollection{display:flex;overflow:auto;justify-content:flex-start}.salonLastTest .abilityCard{flex:0 0 180px}}