/* The portrait layer sits above the rule, while tabs remain independently clickable. */
.inventory-tabs{position:relative;z-index:2}
.tab-buttons{position:relative;z-index:2}
.tab-buttons [aria-selected=true]:after{z-index:3}
.tour-timer{position:absolute;bottom:-1px;left:0;right:0;height:2px;overflow:hidden;pointer-events:none}
#tour-progress{display:block;width:100%;height:100%;background:var(--volt);transform:scaleX(0);transform-origin:left;opacity:.85}
.inventory-panels{overflow:visible;position:relative;z-index:3}
.inventory-panel{min-height:480px;border-radius:0 0 14px 14px}
.class-panel{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:300px auto;align-content:start;align-items:start;gap:18px 30px;padding:26px 36px;min-height:0}
.class-intro{align-self:center;position:relative;z-index:1;max-width:100%;padding:0}
.class-intro h3{font-size:2.5rem;margin:0 0 12px}
.class-intro .eyebrow{margin-bottom:18px}
.class-intro>p:not(.eyebrow){min-height:0;max-width:38ch;margin:15px 0 18px;font-size:15px}
.class-tags{display:flex;flex-wrap:wrap;gap:7px;align-items:start}
.class-tags>span{border:1px solid #c8893f60;color:var(--bronze-hi);background:#c8893f09;border-radius:20px;padding:4px 10px;font-size:11px;line-height:1.5}
.class-tags>span+span{border-color:#3fd0ff35;color:#b5d5df;background:#3fd0ff06}
.class-portrait{--portrait-rise:115px;--portrait-height:445px;position:absolute;z-index:3;right:22px;top:calc(-1 * var(--portrait-rise));width:46%;max-width:490px;height:var(--portrait-height);overflow:hidden;pointer-events:none;mask-image:linear-gradient(#000 0%,#000 82%,transparent 100%)}
.class-portrait:before{content:'';position:absolute;left:0;right:0;top:var(--portrait-rise);height:2px;background:var(--bg2)}
.class-portrait img{position:relative;display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 12px 16px #0003)}
.class-portrait[data-portrait=barbarian]{--portrait-rise:205px;--portrait-height:535px}
.class-portrait[data-portrait=paladin]{--portrait-rise:150px;--portrait-height:480px}
.class-portrait[data-portrait=wizard]{--portrait-rise:165px;--portrait-height:495px}
.class-portrait[data-portrait=unavailable]{opacity:0}
.class-grid{grid-column:1/-1;grid-row:2;grid-template-columns:repeat(6,minmax(0,1fr));align-self:start;gap:7px;position:relative;z-index:4}
.class-grid button{flex-direction:row;justify-content:center;padding:10px 8px;gap:9px;min-height:50px}
.class-grid img{width:25px;height:25px}
.story-panel{overflow:hidden}.story-panel>img{height:480px}
@media(min-width:821px) and (max-width:1100px){.class-panel{padding:24px 28px;grid-template-rows:300px auto}.class-intro h3{font-size:2.2rem}.class-portrait{width:45%;right:12px;--portrait-rise:80px;--portrait-height:405px}.class-portrait[data-portrait=barbarian]{--portrait-rise:140px;--portrait-height:465px}.class-portrait[data-portrait=paladin],.class-portrait[data-portrait=wizard]{--portrait-rise:110px;--portrait-height:435px}.class-tags>span{font-size:10px}}
@media(min-width:601px) and (max-width:820px){.inventory-panel{min-height:0}.class-panel{padding:24px;grid-template-columns:1.05fr 1fr;grid-template-rows:minmax(255px,auto) auto;gap:16px 20px}.class-intro h3{font-size:2rem}.class-intro .eyebrow{margin-bottom:12px;font-size:8px}.class-intro>p:not(.eyebrow){font-size:13px;margin:12px 0}.class-tags{gap:5px}.class-tags>span{font-size:9px;padding:3px 8px}.class-portrait{width:45%;right:6px;--portrait-rise:38px;--portrait-height:312px}.class-portrait[data-portrait=barbarian]{--portrait-rise:88px;--portrait-height:362px}.class-portrait[data-portrait=paladin],.class-portrait[data-portrait=wizard]{--portrait-rise:65px;--portrait-height:339px}.class-grid{gap:6px}.class-grid button{flex-direction:column;padding:8px 3px;gap:4px;font-size:9px;min-height:60px}.story-panel>img{height:390px}}
@media(max-width:600px){.inventory-panel{min-height:0}.class-panel{padding:22px 18px;grid-template-columns:1fr;grid-template-rows:auto auto;gap:18px;align-content:start}.class-intro{padding:0;align-self:start}.class-intro .eyebrow{font-size:8px;line-height:1.6;max-width:calc(100% - 138px);margin:0 0 12px}.class-intro .eyebrow:before{display:none}.class-intro h3{font-size:1.8rem;max-width:calc(100% - 128px);margin:0 0 10px}.class-tags{max-width:calc(100% - 138px);min-height:88px;align-content:start;gap:5px}.class-tags>span{font-size:9px;line-height:1.45;padding:3px 7px}.class-intro>p:not(.eyebrow){min-height:0;margin:14px 0 12px;font-size:13px;max-width:none}.class-intro .text-link{font-size:12px;margin-top:0}.class-portrait{width:142px;right:0;max-width:none;--portrait-rise:10px;--portrait-height:204px;mask-image:linear-gradient(#000 78%,transparent 100%)}.class-portrait[data-portrait=barbarian]{--portrait-rise:27px;--portrait-height:221px}.class-portrait[data-portrait=paladin],.class-portrait[data-portrait=wizard]{--portrait-rise:20px;--portrait-height:214px}.class-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.class-grid button{flex-direction:column;min-height:61px;font-size:9px;padding:8px 3px;gap:4px}.class-grid img{width:24px;height:24px}.story-panel>img{height:235px}}

/* Desktop/tablet portraits share the heading's visible top, with room for every pose. */
@media(min-width:601px){
 #whats-inside .section-heading>div{max-width:49%}
 .class-portrait{right:18px}
 .class-portrait img{position:absolute;right:0;max-width:none;object-position:center top}
}

/* Donation copy forms one compact column; artwork occupies the right side. */
.support-heading{display:block;margin-bottom:90px}
.support-heading .lead{max-width:64ch}
.support-cards{gap:28px;align-items:stretch;grid-auto-rows:1fr}
.support-card{overflow:visible;isolation:isolate;padding:28px 30px;min-height:0}
.support-card .eyebrow{position:relative;z-index:2;max-width:56%;min-height:0;line-height:1.7;padding:0;margin:0 0 16px}
.support-card h3{position:relative;z-index:2;max-width:58%;font-size:2rem;min-height:0;margin:0 0 14px}
.support-card p:not(.eyebrow){position:relative;z-index:2;max-width:54%;min-height:0;padding:0;margin:0 0 20px}
.support-card .btn,.support-card small,.support-more{position:relative;z-index:2}
.support-card .btn{margin:0 0 12px;max-width:100%}
.support-card small{max-width:58%;line-height:1.6}
.support-more{min-height:0;margin-top:12px;line-height:1.6}
.support-art{position:absolute;right:8px;top:-28px;width:48%;max-width:300px;height:auto;aspect-ratio:600/760;max-height:calc(100% + 8px);pointer-events:none;z-index:0;overflow:hidden;mask-image:linear-gradient(#000 0%,#000 72%,transparent 100%)}
.support-art img{display:block;width:100%;height:100%;max-width:none;margin:0;object-fit:contain;object-position:right bottom}
.lamp-art{width:39.2%;max-width:245px;aspect-ratio:490/760}
@media(min-width:1001px) and (max-width:1200px){
 .support-card{padding:26px 24px}
 .support-card h3{font-size:1.75rem;max-width:59%}
 .support-card p:not(.eyebrow){font-size:14px;max-width:51%}
 .support-card .eyebrow{font-size:9px}
 .support-card .btn{font-size:14px;padding:12px 16px}
}
@media(max-width:1000px){
 .support-cards{grid-template-columns:1fr;gap:88px}
 .support-card{padding:28px;min-height:0}
 .support-card h3{max-width:58%}
 .support-card p:not(.eyebrow){max-width:54%}
}
@media(max-width:600px){
 .support-heading{margin-bottom:82px}
 .support-cards{gap:88px}
 .support-card{padding:26px 24px;min-height:0}
 .support-art{width:160px;height:145px;aspect-ratio:auto;top:-24px;right:0;mask-image:linear-gradient(#000 0%,#000 85%,transparent 100%)}
 .lamp-art{width:131px;right:4px}
 .support-art img{height:auto}
 .support-card .eyebrow{max-width:calc(100% - 120px);font-size:9px;min-height:30px;margin-bottom:12px}
 .support-card h3{max-width:calc(100% - 112px);font-size:1.7rem;min-height:0;margin-bottom:18px}
 .support-card p:not(.eyebrow){max-width:none;margin-bottom:18px}
 .support-card .btn{font-size:14px}
 .support-card small{max-width:none;font-size:11px}
}
@media(prefers-reduced-motion:reduce){#tour-progress{display:none}}