.resource-class-catalog{margin:0 0 14px;padding:17px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:0 9px 28px rgba(22,42,82,.04)}
.resource-class-catalog>header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}
.resource-class-catalog>header small{display:block;color:#ef241c;font-size:9px;font-weight:900;letter-spacing:.1em}
.resource-class-catalog>header h3{margin:3px 0 0;font-size:16px}
.resource-class-catalog>header>span{padding:7px 10px;border-radius:99px;background:#eef4ff;color:#155eef;font-size:9px;font-weight:850}
.resource-class-browser{display:flex;flex-wrap:wrap;gap:9px}
.resource-class-option{display:flex;align-items:center;gap:9px;min-width:142px;padding:9px 12px;border:1px solid var(--line);border-radius:13px;background:var(--surface);color:var(--text);cursor:pointer;text-align:left;transition:.18s ease}
.resource-class-option:hover{border-color:#91b4ff;transform:translateY(-1px);box-shadow:0 8px 18px rgba(21,94,239,.08)}
.resource-class-option>b{display:grid;place-items:center;flex:0 0 34px;height:42px;border:2px solid #155eef;border-radius:7px;background:#fff;color:#0b1f44;font-size:15px;box-shadow:3px 4px 8px rgba(17,39,78,.08)}
.resource-class-option>span,.resource-class-option small{display:block}.resource-class-option>span{font-size:11px;font-weight:850}.resource-class-option small{margin-top:3px;color:var(--muted);font-size:8px;font-weight:650}
.resource-class-option.active{border-color:#155eef;background:#edf4ff;box-shadow:0 8px 20px rgba(21,94,239,.11)}
.resource-class-option.active>b{background:#155eef;color:#fff}.resource-cloud-tag{background:#e9fbf4!important;color:#087a55!important}
body.dark .resource-class-catalog{background:#102039}body.dark .resource-class-catalog>header>span,body.dark .resource-class-option.active{background:#142d55}body.dark .resource-class-option{background:#102039}body.dark .resource-class-option>b{background:#152841;color:#fff}
@media(max-width:760px){.resource-class-catalog{padding:13px}.resource-class-catalog>header{align-items:flex-end}.resource-class-browser{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(132px,44%);overflow-x:auto;flex-wrap:nowrap;padding:1px 1px 8px;scroll-snap-type:x proximity}.resource-class-option{min-width:0;scroll-snap-align:start}.resource-class-catalog>header>span{max-width:48%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
