.mc { --cols:8; --rows:6; position:relative; width:min(100%, calc(var(--cols) * 78px)); display:grid; grid-template-columns:repeat(var(--cols), 1fr); gap:0; padding:0; border-radius:14px; background:radial-gradient(ellipse at 50% 30%, #1e6f86, #0f3d52); container-type:inline-size; }
.mc > * { aspect-ratio:5/6; min-width:0; }
.mc .mt { --tw:calc(100cqw / var(--cols) * .9); margin:6%; width:88%; height:88%; }
.mc .mt .big { font-size:calc(var(--tw) * .55); }
.mc .ln { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:5; }
.mc .ln polyline { fill:none; stroke:#fde047; stroke-width:4; stroke-linejoin:round; stroke-linecap:round; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 3px rgba(0,0,0,.5)); }
.bar button { min-height:44px; }