body { font-family: sans-serif; text-align: center; background: #f4f4f9; padding: 20px; }
.arena { display: flex; justify-content: center; align-items: center; gap: 20px; margin-top: 30px; flex-wrap: wrap; }
.frame { background: white; padding: 15px; border-radius: 12px; box-shadow: 0 5px 15px rgba(0,0,0,0.1); cursor: pointer; transition: 0.2s; border: 4px solid transparent; width: 300px; }
.frame:hover { border-color: #ff4081; transform: scale(1.02); }
.frame img { width: 100%; height: 300px; object-fit: cover; border-radius: 8px; pointer-events: none; }
.vs { font-size: 2rem; font-weight: bold; color: #888; }
.score { margin-top: 10px; font-weight: bold; color: #333; font-size: 1.2rem; }
.label { font-weight: bold; margin-bottom: 10px; color: #666; }
#status { color: #666; font-style: italic; }
.image-id { 
    margin-top: 8px; 
    font-size: 0.8rem; 
    color: #999; 
    font-family: monospace; 
    background: #f0f0f0; 
    padding: 4px 8px; 
    border-radius: 4px; 
    display: inline-block;
}