.page-shell{max-width:1200px;padding-top:24px}main{padding:24px 0}.page-header{padding-bottom:18px}h1{font-size:clamp(30px,4vw,44px);margin:12px 0}.intro{max-width:none;margin:12px 0 24px}.levels-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.level-card{display:flex;flex-direction:column;text-decoration:none;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:var(--card);box-shadow:0 3px 8px #00000012;transition:transform .15s,border-color .15s}.level-card:hover{transform:translateY(-3px);border-color:var(--accent)}.level-art{position:relative;min-height:168px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--accent) 5%,var(--bg))}.level-number{position:absolute;left:18px;top:12px;font-size:32px;font-weight:700;color:var(--text-muted)}.level-keys{display:flex;gap:7px;color:var(--accent);margin-top:20px}.level-keys span{display:grid;place-items:center;width:42px;height:46px;border:2px solid currentColor;border-bottom-width:5px;border-radius:7px;font-size:23px;font-weight:650;background:var(--card)}.level-caption{border-top:1px solid var(--border);padding:16px 18px}.level-caption h2{font-size:18px;margin:0 0 6px}.level-caption p{color:var(--text-muted);font-size:14px;margin:0;line-height:1.5}.level-count{display:block;margin-top:10px;font-size:12px;color:var(--text-muted)}.current-label{position:absolute;right:12px;top:16px;font-size:11px;color:var(--accent);font-weight:600}.level-card[aria-current]{border-color:var(--accent)}@media(min-width:1500px){.page-shell{max-width:1320px}}@media(max-width:800px){.levels-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}}@media(max-width:480px){.levels-grid{grid-template-columns:1fr}.level-art{min-height:140px}.page-header{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){.level-card{transition:none}}

.level-card.locked-level{opacity:.55;cursor:not-allowed}.level-card.locked-level:hover{transform:none;border-color:var(--border)}