#class-search{width:100%;border:2px solid #ded5e8;border-radius:12px;padding:10px 13px;background:#fffdf9;font:800 12px Nunito;margin:8px 0}
.roster-panel{display:flex;flex-direction:column;min-height:0;overflow:hidden!important}
#class-filters{flex-shrink:0;flex-wrap:wrap}#classes{grid-template-columns:repeat(3,minmax(0,1fr));overflow:auto;min-height:0;align-content:start;flex:1;padding:3px 4px 8px;gap:9px}
#classes .class-card{min-height:125px;padding:11px 6px;gap:3px}#classes .class-card img{height:65px;width:70px}#classes .class-card-name{font-size:16px}#classes .class-card small{font-size:8px;line-height:1.35}
.roster-tip{flex-shrink:0;margin-top:9px;padding:10px!important}.roster-tip p{font-size:9px!important}
#class-state{display:block;color:#756183;font-size:10px;min-height:12px;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:5px}
@media(max-width:1000px){#classes{grid-template-columns:repeat(2,minmax(0,1fr))}#classes .class-card{min-height:105px}}
@media(max-width:700px){.roster-panel{overflow:visible!important}#classes{max-height:480px;flex:initial}#classes .class-card{min-height:100px}#classes .class-card img{height:54px;width:60px}#class-state{font-size:8px;max-width:110px}}

.spell-availability{display:inline-block;font:900 9px Nunito;padding:4px 8px;border-radius:20px;margin:5px 0}.spell-availability.available{background:#deedce;color:#4f7835}.spell-availability.pending{background:#eee9f4;color:#82718d}.kit-heading small{max-width:45%;text-align:right;line-height:1.5}

.active-spell-effects{max-height:240px;overflow:auto;margin:18px 0;text-align:left}.active-spell-effects>div{display:flex;align-items:center;gap:10px;background:#f1ebf5;border-radius:10px;padding:9px;margin:6px 0}.active-spell-effects img{width:32px;height:32px;object-fit:contain}.active-spell-effects span{flex:1}.active-spell-effects small{display:block;margin-top:3px}.active-spell-effects em{font-style:normal;font-weight:900;color:#8e739b}

@media(max-width:700px){.all-class-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;scroll-snap-type:x proximity;padding:3px 3px 12px;max-width:100%}.all-class-tabs button{flex:0 0 96px;min-width:96px;scroll-snap-align:start}.catalog-toolbar{margin-top:8px}}

@media(max-width:700px){.catalog-intro{display:grid;grid-template-columns:32px minmax(0,1fr);gap:10px;padding:14px}.catalog-intro>img{width:32px;height:36px;align-self:start}.catalog-intro>div{display:contents}.catalog-intro b{align-self:center}.catalog-intro p,.catalog-intro>button{grid-column:1/-1}.catalog-intro p{margin:0;font-size:12px;line-height:1.6}}
