.class-panel{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:0 0 14px}.class-panel>div{display:grid;grid-template-columns:auto 1fr;align-items:center;background:#eef4e8;border-radius:14px;padding:10px 8px}.class-panel span{grid-row:1/3;font-size:19px;color:var(--green);margin-right:5px}.class-panel strong{font:12px "Jua"}.class-panel b{grid-column:2;font:18px "Jua";color:var(--green)}.class-panel small{grid-column:1/3;text-align:center;font-size:10px;color:var(--muted);margin-top:5px;line-height:1.35}.class-panel small em{display:block;font-style:normal;color:var(--green);margin-top:2px}.class-panel>div>i{grid-column:1/-1;display:block;height:4px;margin-top:6px;border-radius:9px;background:#d7e3d7;overflow:hidden}.class-panel>div>i u{display:block;width:var(--progress);height:100%;border-radius:inherit;background:var(--green)}.class-panel .photo-level{grid-column:1/-1;margin:2px 0 0;padding:10px 12px;border-radius:12px;text-align:center;font-size:12px;font-weight:700}.class-panel .photo-level.unlocked{color:#087a50;background:#e2f5e8;border:1px solid #b9dfc4}.class-panel .photo-level.locked{color:#6d746f;background:#f1f3f1;border:1px solid #d9dedb}.class-panel .class-rule{grid-column:1/-1;margin:0;text-align:center;color:var(--muted);font-size:10px;line-height:1.4}