.badge-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:18px 0 32px}.badge-card{display:flex;flex-direction:column;align-items:center;position:relative;text-align:center;background:var(--panel,#fff);border:1px solid var(--line,#d4dce6);border-radius:18px;padding:20px 16px;min-width:0;color:inherit;text-decoration:none;transition:transform .15s,border-color .15s}.badge-card:hover{transform:translateY(-3px);border-color:#8c9cbb}.badge-card:focus-visible{outline:3px solid #8c78cc;outline-offset:3px}.badge-card img{width:112px;height:129px;object-fit:contain;filter:drop-shadow(0 5px 6px #0c203321);margin:3px 0 12px}.badge-card h3{font-size:1rem;margin:6px 0 8px}.badge-card p{font-size:.85rem;line-height:1.6;margin:4px 0;color:var(--muted,#5b6d83)}.badge-card strong{font-size:1.12rem;font-variant-numeric:tabular-nums}.badge-level{font-size:.75rem;letter-spacing:.07em;color:var(--muted,#5b6d83)}.badge-card progress{width:100%;height:6px;border:0;border-radius:6px;background:#dce2eb;margin:14px 0 6px;appearance:none}.badge-card progress::-webkit-progress-bar{background:#dce2eb;border-radius:6px}.badge-card progress::-webkit-progress-value{background:#7860b7;border-radius:6px}.badge-card progress::-moz-progress-bar{background:#7860b7;border-radius:6px}.badge-locked img{filter:grayscale(1);opacity:.58}.badge-locked{border-style:dashed}.badge-wall-title{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:34px}.badge-wall-title h2{margin:0}.badge-wall-title a,.badge-rules a{color:var(--accent,#2563eb)}.badge-shelf-note,.badge-rules p{color:var(--muted,#61758c);line-height:1.8}.badge-strip{display:flex;gap:2px;flex-wrap:wrap;min-width:95px;max-width:192px}.badge-strip a{display:inline-flex;align-items:center}.badge-strip img{width:32px;height:37px}.badge-selectors{display:flex;gap:20px;flex-wrap:wrap;margin:28px 0 10px}.badge-selectors label{display:flex;flex-direction:column;gap:10px;font-weight:600}.badge-selectors select{padding:12px 34px 12px 14px;min-width:200px;border:1px solid var(--line,#c2cfdf);border-radius:10px;background:var(--panel,#fff);color:inherit;font:inherit}.badge-selectors [hidden]{display:none}.badge-catalogue{grid-template-columns:repeat(auto-fit,minmax(165px,1fr))}.badge-catalogue .badge-card img{width:128px;height:147px}.badge-catalogue .badge-card h3{font-size:.92rem}.badge-rules strong{color:inherit}.badge-threshold-table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:14px}.badge-threshold-table th,.badge-threshold-table td{text-align:right;padding:14px 16px;border-bottom:1px solid var(--line,#d4dce6);color:inherit}.badge-threshold-table th:first-child,.badge-threshold-table td:first-child{text-align:left}.badge-download{font-size:.8rem!important;margin-top:12px!important;color:var(--accent,#2563eb)!important}.badge-catalogue .badge-card{cursor:default}.badge-rule-summary{font-size:.88rem;line-height:1.8}.project-awards{display:flex;gap:5px;justify-content:flex-end}.project-awards img{width:36px;height:41px}html[data-theme=dark] .badge-card,html[data-theme=dark] .badge-selectors select{background:#172330;border-color:#35465b;color:#e6edf6}html[data-theme=dark] .badge-card p,html[data-theme=dark] .badge-level,html[data-theme=dark] .badge-shelf-note,html[data-theme=dark] .badge-rules p{color:#b6c5d8}html[data-theme=dark] .badge-card:hover{border-color:#b3a3e3}html[data-theme=dark] .badge-wall-title a,html[data-theme=dark] .badge-rules a,html[data-theme=dark] .badge-download{color:#afc9ff!important}html[data-theme=dark] .badge-card progress::-webkit-progress-bar{background:#35455b}html[data-theme=dark] .badge-threshold-table th,html[data-theme=dark] .badge-threshold-table td{border-color:#35465b}html[data-theme=dark] .badge-card img{filter:drop-shadow(0 5px 8px #0006)}html[data-theme=dark] .badge-locked img{filter:grayscale(1);opacity:.6}@media(max-width:600px){.badge-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.badge-card{padding:16px 10px}.badge-card img{width:90px;height:104px}.badge-catalogue .badge-card img{width:106px;height:122px}.badge-wall-title{align-items:flex-start;flex-direction:column;gap:8px}.badge-selectors label,.badge-selectors select{width:100%}.badge-selectors{gap:14px}.badge-threshold-table th,.badge-threshold-table td{padding:12px}.badge-card strong{font-size:1rem}}@media(prefers-reduced-motion:reduce){.badge-card{transition:none}.badge-card:hover{transform:none}}
.badge-card progress{--badge-progress-track:#dce2eb;--badge-progress-fill:#7860b7;background:var(--badge-progress-track);color:var(--badge-progress-fill);accent-color:var(--badge-progress-fill)}
.badge-card progress::-webkit-progress-bar{background:var(--badge-progress-track)}
.badge-card progress::-webkit-progress-value{background:var(--badge-progress-fill)}
.badge-card progress::-moz-progress-bar{background:var(--badge-progress-fill)}
html[data-theme=dark] .badge-card progress{--badge-progress-track:#3d4b62;--badge-progress-fill:#d5c3ff;background:var(--badge-progress-track);color:var(--badge-progress-fill);accent-color:var(--badge-progress-fill)}
html[data-theme=dark] .badge-card progress::-webkit-progress-bar{background:var(--badge-progress-track)}
html[data-theme=dark] .badge-card progress::-webkit-progress-value{background:var(--badge-progress-fill)}
html[data-theme=dark] .badge-card progress::-moz-progress-bar{background:var(--badge-progress-fill)}
/* Compact profile shelves; the catalogue keeps its larger artwork. */
#badges .badge-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:10px 0 20px}
#badges>.badge-wall-title{margin-top:24px}
#badges>.badge-shelf-note{font-size:.8rem;margin:8px 0 14px}
#badges>h3{font-size:1rem;margin:16px 0 8px}
#badges .badge-card{padding:12px 10px;border-radius:12px}
#badges .badge-level{font-size:.66rem;letter-spacing:.02em;min-height:16px}
#badges .badge-card img{width:80px;height:92px;margin:4px 0 6px}
#badges .badge-card h3{font-size:.79rem;line-height:1.35;min-height:2.7em;display:flex;align-items:center;justify-content:center;margin:2px 0 4px}
#badges .badge-card strong{font-size:.91rem;line-height:1.4}
#badges .badge-unit{display:none}
#badges .badge-card progress{height:5px;margin:9px 0 5px}
#badges .badge-card .badge-next{font-size:.69rem;line-height:1.45;margin:0;overflow-wrap:anywhere}
@media(max-width:1100px){#badges .badge-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:700px){#badges .badge-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:480px){#badges .badge-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}#badges .badge-card{padding:10px 8px}}